콘텐츠 보안 정책과 통합

콘텐츠 보안 정책(CSP)은 로드 및 실행이 허용되는 리소스와 스크립트를 제한하여 웹페이지를 보호하는 수단입니다. 웹 서버의 HTTP 응답에서 Content-Security-Policy 헤더를 설정하여 CSP를 사용 설정할 수 있습니다.

CSP를 구성하는 두 가지 표준 방법은 다음과 같습니다.

  1. 페이지에 리소스를 삽입할 수 있는 도메인의 허용 목록을 지정합니다.

  2. 페이지의 리소스를 표시해야 하는 임의의 nonce를 지정하여 로드합니다. 이 접근 방식을 엄격한 CSP라고 합니다.

Google 게시자 태그 (GPT)에서 사용하는 도메인은 시간이 지남에 따라 변경되므로 엄격한 CSP만 지원됩니다 (옵션 2). 이 접근 방식을 사용하면 오래되어 사이트가 손상될 수 있는 도메인의 순차적 목록을 유지할 필요가 없습니다.

GPT로 CSP 설정

  1. 웹 서버에서 CSP를 사용 설정합니다.

    엄격한 CSP 채택에 설명된 단계를 따라 CSP 헤더를 설정하고 gpt.js를 비롯한 페이지의 모든 스크립트 태그에 nonce를 적용합니다. GPT는 구체적으로 다음과 같은 CSP 지시어를 지원합니다.

    Content-Security-Policy:
      object-src 'none';
      script-src 'nonce-{random}' 'unsafe-inline' 'unsafe-eval' 'strict-dynamic' https: http:;
      base-uri 'none';
      report-uri https://your-report-collector.example.com/
    

    사용 사례에 적합한 경우 좀 더 관대한 정책을 선택할 수 있습니다. 더 제한적인 정책이 예고 없이 중단될 수 있습니다.

  2. 교차 도메인 렌더링 사용 설정

    광고 iframe은 CSP에서 허용하지 않는 외부 리소스를 로드할 수 있습니다. 동일한 도메인 iframe은 최상위 창의 CSP를 상속하고 GPT는 광고 소재의 콘텐츠를 제어할 수 없으므로 일반적으로 동일한 도메인 광고 소재는 CSP 헤더에서 제대로 작동하지 않습니다.

    모든 광고 소재에 교차 도메인 렌더링을 사용 설정하려면 광고 슬롯을 로드하기 전에 googletag.pubads().setForceSafeFrame(true)를 실행하세요.

    <!doctype html>
    <html>
      <head>
        <meta charset="utf-8">
        <title>Hello GPT</title>
        <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js" nonce="KC7tcz53FHqumKP1"></script>
        <script nonce="KC7tcz53FHqumKP1">
          window.googletag = window.googletag || {cmd: []};
          googletag.cmd.push(function() {
            googletag.pubads().setForceSafeFrame(true);
          });
        </script>
      </head>
    

테스트

먼저 Content-Security-Policy 대신 Content-Security-Policy-Report-Only 헤더를 설정하여 정책을 테스트하는 것이 좋습니다. 헤더는 위반을 보고하지만 여전히 페이지에서 위반을 허용합니다.