콘텐츠 보안 정책과 통합

콘텐츠 보안 정책 (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 src="https://securepubads.g.doubleclick.net/tag/js/gpt.js" nonce="KC7tcz53FHqumKP1" async></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 헤더를 설정하여 먼저 정책을 테스트하는 것이 좋습니다. 헤더가 위반을 보고하지만 페이지에서 계속 허용합니다.