Clipboard 이미지의 업로드

난 한번도 그런 생각을 해본 적이 없는데 클립보드의 이미지를 업로드할 수 있게 해달라는 요청을 여러번 받았다. 내 생각에는 이미지 파일로 만들어서 업로드하는 것이 관리도 편하고 더 좋을 것 같은데 클립보드에서 바로 업로드로 이어지는 것이 더 편한가보다. 내가 편히 쓰려고 만든 프로그램이라 내가 안쓰는 기능은 왠만하면 잘 넣지 않지만 이번엔 시간을 내서 해보기로 했다.

Electron의 클립보드

Electron에서는 clipboard의 이미지를 반환해주는 api를 제공하는데 그 이미지라는 것은 nativeImage다. nativeImage를 png나 jpeg, bitmap으로 변환하면 드디어 업로드 가능한 데이터가 만들어진다. 이 데이터는 또 Buffer로 만들어지는데 업로드하기 위해선 stream으로 변환이 필요하다. stream을 formdata에 넣어주면 정말 업로드가 된다.

요약하자면 clipboard -> nativeImage -> buffer -> stream -> formdata 의 과정을 거쳐야 한다는 것이다. 참 복잡하다. 게다가 formdata에 filename과 content-type을 지정해줘야 tistory api가 받아준다. 수많은 시행착오를 거쳐서 결국 만든 코드는 이렇다. (clipboard 업로드 기능을 만든 기념으로 text 대신 이미지로..)

개밥먹기

말했듯이 클립보드의 이미지를 바로 업로드 하는 걸 생각해본 적도 없고 원하지도 않았다. 그런데 막상 써보니 생각보다 좋다. 특히 뭔가를 설명할 때 아주 유용하다. 방금도 코드를 복사해서 넣었다. 아주 편하게. 스크린샷을 만들때 키보드 키하나를 더 누르기만 하면 되니 파일을 이리저리 옮기는 번거로운 일이 없어졌다. 잘 안 쓸 줄 알았는데 어째 내가 잘 쓰게 될 것 같다. 좋다.

반응형