rich text editor로 사진 업로드에 관해 궁금한게 있습니다.

Question

안녕하세요. 현재 rich text editor로 사진을 삽입하는 기능을 만들고 있습니다.근데 처음 해보는 거라 기술적인 측면에서 어떻게 해야할지 잘 모르겠네요.(백그라운드로는 Next.js와 supabase(db, storage)를 이용한 프로젝트를 만들고 있습니다.)제가 생각하는건 사용자가 에디터에서 사진 첨부 버튼을 눌러서 에디터에 이미지를 적용하는 것 까지는 했는데,그 이후에 어떻게 해야할지 잘 모르겠습니다.적용된 이미지의 src가 blob:http://localhost:3000/3e64bfb6-0e45-4c59-a262-20cf905b2786 이런식으로 되어있습니다.제가 경험이 없어서 일단 혼자 생각해본건...사용자가 로컬 이미지를 불러오고 글을 작성한 다음 글쓰기 (저장) 버튼을 클릭로컬로 사용된 이미지들을 file 형식으로 받아옴.(안 중요) 서버에서 해당 이미지를 .webp 형식으로 최적화시킴이미지를 storage에 저장 후, publicUrl(호스팅될 이미지들의 src)을 받음받은 src를 다시 완성된 글의 img에 src로 덮어쓰기함 (blob~ -> 새로운 src)이 정도 생각해봤는데, 실제로는 어떻게 하는지 궁금합니다.

핸호 · Answer

경험상 rich editor는 복붙도 있고, undo/redo 도 있기 때문에 이미지 삽입시점마다 storage에 올렸던것 같아요. 노션도 그런식으로 되어 있죠.그 대신, 악성재고(글을 저장하지 않은체 끈 경우 등)를 방지하기 위한 batch를 따로 돌렸습니다.

rich text editor로 사진 업로드에 관해 궁금한게 있습니다.

1개의 답변

기술 목록