summernote 도입하려다 보니 난관이 많군요.

emptynote의 이미지

직접 개발한 코다라는 오픈 소스 가지고 이런거 만들 수 있고

성능 괜찮아요 라고 홍보할겸

겸사 겸사 코다 개발 커뮤니티 사이트 구축중인데

게시판에 summernote 도입하려다 보니 난관이 많군요.

첫번째 글에 이미지 추가할때 작성글 내부에 포함 시키는것이 아닌 외부 파일로 뺄경우에 대해서 아무런 준비가 안되어 있었네요. 첨부 파일을 만들긴 했지만 작성글 내부에 포함시킬 생각이 전혀 없었기때문입니다. 첨부 파일과 별도로 작성글에 포함될 이미지용으로 따로 만들어야 하는데 소를 직접 키울려니 아득하네요.

두번째 작성자가 html 로 작성할 경우 "cross site scripting" 를 막는것입니다.

이건 오키에서 질문을 올려 조언을 들었고 그때 소개 받은 jsoup 에서 찾았습니다.

jsoup 에서 "Sanitize untrusted HTML (to prevent XSS)" (참고 주소 : https://jsoup.org/cookbook/cleaning-html/whitelist-sanitizer ) 입니다. 그렇지만 테스트도 필요하고 무엇보다 이거 동작 원리를 이해하고 있어야 문제 상황에 잘 대처할 수 있어 공부가 필요하는 사실에는 변함이 없습니다.

마지막 세번째로 글에 이미지 추가할때 외부 파일로 빼는 샘플 예제가 ajax 뿐이네요. 비 ajax 로 사이트를 구축하고 있기때문에 통일성 차원에서 ajax 넣을 수 없어 방법을 찾긴 했습니다. 요점은 file input type file node 를 clone 하여 append 하는 방법인데 이 코드가 대부분의 브라우저에서 잘 동작을 할지 모르겠네요.

참고 주소 : https://codepen.io/rtm/pen/PpeZwZ