React ) html파일 렌더링하기, script 태그 사용하기

퍼블리싱을 받았는데, noscript와 script 태그를 사용한 부분이 있었다.

문제는 리액트에선 두 태그를 사용하기가 까다롭다는 것…

그래서 아예 html파일을 만들고, 해당 파일을 iframe으로 렌더링하기로 했다.

html 예시

<div>
  <div>
    <noscript>
      <img src="../addr" width="100%" height="100%" />
    </noscript>
    <script
      type="text/javascript"
      charset="utf-8"
      src="../addr"
    ></script>
  </div>
</div>

iframe을 이용해 렌더링하는 법

export const Component = () => {

  const iframePart = () => {
    return {
      __html: '<iframe src="./html/test.html" width="1600px" height="100%"></iframe>',
    };
  };

  return (

      <div
        style={{ margin: 'auto', position: 'relative', width: '100%', height: '100%', overflow: 'hidden' }}
        dangerouslySetInnerHTML={iframePart()}
      />

  );
};