07-18-2022 TIL // React HTML file 추가, 렌더링

개인정보처리방침과 서비스정책에 대해서 하나의 페이지를 만들어야 했다. html 파일로 만들어졌고 react 내에서 렌더링을 해야하는데 코드가 너무 길어서 어떻게 처리해야 할지 막막해 하다가 구글링을 통해 한방에 오류 없이 해결했다. 단, 이름이 뭔가 꺼림칙하다. dangerous .....

0. dangerouslySetInnerHTML

   dangerouslySetInnerHTML은 브라우저 DOM에서 innerHTML을 사용하기 위한 react의 대체 방법.
   이름에서 설명하듯 사이트 간 스크립팅 공격에 쉽게 노출될 수 있다고 한다.
   스크립팅 공격이라 말이 좀 어렵다.

const Test = () => {
  
  	const testHtml = `<p>hello</p>`
  	
	return(<div dangerouslySetInnerHTML={{__html: testHtml}}</div>)
}