본문 바로가기
728x90

react-quill2

79. 웹에디터의 이해 및 실습 요즘은 --save 안해도 됨 여기서 onChange는 ReactQuill에서 만든거라서 event가 들어가지 않는다 import 'react-quill/dist/quill.snow.css'; 브라우저의 document를 찾을 수 없다~ 잘 적은거 같은데 에러가 나타난다 라이브러리별 발생하는 SSR 이슈와 보완방법 - dynamic import Webpack Server 브라우저에서만 보여줘~ 를 해도 안된다 다르게 접근을 해줘야 한다 dynamic import - Next에서 제공 import dynamic from "next/dynamic"; ssr: false => 서버에서 렌더링 하는건 안할거다~ 성능 최적화 Modal을 여기서만 사용한다면 코드 스플릿팅 code-splitting 웹에디터에 re.. 2023. 3. 9.
웹에디터, 다이나믹 임포트, 웹 공격, react-quill 8/10 작성한 내용의 앞 뒤로 등의 태그를 붙여서 데이터베이스에 저장했을 뿐이었다. 이 내용들이 문자열이 아닌, 태그의 기능 그 자체로 인식하게 만들기 위해 dangerouslySetInnerHTML 이라는 속성을 사용해서 해결했다. 여기서 한가지 호기심이 생길 수 있다. 태그처럼 자바스크립트로 해킹 기능을 작성하면...? 이 때, 누군가 글 상세보기를 클릭하면, 작성된 자바스크립트 코드가 실행될 것이고, 해킹(예, 토큰 탈취, 탈취된 토큰으로 유해 게시물 생성 및 중요 게시물 삭제 등)을 당할 수 있다. react-quill 라이브러리에서는 이를 사전에 차단해 준다. (태그를 의미하는 단어인 '' 등을 &lt, &gt와 같이 변경하여 차단) 하지만, react-quill만 믿고 방심 했다가는, 다른 .. 2021. 10. 23.
728x90