Summernote 사용법 2 글작성에러 ,작성후css 적용안됨 오류 해결법 (xss공격막기)

summernote는 알아서 xss공격을 막아준다
그래서 특수문자는 저장이 안됨
저장할때는 디코딩해주고 뿌려줄때는 다시 인코딩 해줘야함!

먼저 js에 html태그 decode와 encode를 만들어두었음 !

// html태그 decode
function decodeHTMLEntities(str) {
    if(str !== undefined && str !== null && str !== '') {
    	str = str.replace(/</g,"&lt;");
    	str = str.replace(/>/g,"&gt;");
    	str = str.replace(/\"/g,"&quot;");
    	str = str.replace(/\'/g,"&#39;");
    	str = str.replace(/\n/g,"<br />");
    }
    return str;
}


//html태그 encode
function encodeHTMLEntities(str) {
	 if(str !== undefined && str !== null && str !== '') {
    	str = str.replace(/&lt;/g,"<");
    	str = str.replace(/&gt;/g,">");
    	str = str.replace(/&quot;/g,"\"");
    	str = str.replace(/&#39;/g,"\'");
    	str = str.replace(/(<br>|<br\/>|<br \/>)/g,"\n");
    }
    return str;
}

글저장할때는 이런식으로 디코딩해주면 ok!

	


< script>

		      var BOARDCATE = $("#BOARDCATE").val();
	          var BOARDCONT = $('#BOARDCONT').summernote('code')
 
 var data = {
				BOARDCATE : BOARDCATE,
				BOARDCONT : decodeHTMLEntities(BOARDCONT),
				
                };
</script>

해주고 나서 뿌려줄때는 다시 인코딩해서 보여줘야함!

//상세보기에서 하나만뿌려줄때는 
<div id="summernote" >${commu.BOARDCONT}</div> 

<script>
$(function(){
			var boardCont = $("#summernote"+).html();
			$("#summernote").html(encodeHTMLEntities(boardCont));
});


</script>

----------------------------------------------------------
//for문 뿌려줄때는 index넣어줘서 
<c:forEach items="${communitynewList}" var="commu" varStatus="status">
    <div id="summernote${status.index}">${commu.BOARDCONT}</div>
</c:forEach>


<script>
$(function(){
    var contlist = [];
    <c:forEach items="${communitynewList}" var="commu" varStatus="status">
        contlist.push("${status.index}");
    </c:forEach>
    
    contlist.forEach(function(index){
        var boardCont = $("#summernote" + index).html();
        $("#summernote" + index).html(encodeHTMLEntities(boardCont));
    });
});


</script>

🔽 summernote 글작성 완료 !