이 페이지는 Cloud Translation API를 통해 번역되었습니다.

광고 로드 관리 및 새로고침

시작하기 및 기본 개념 예에서는 Google 게시자 태그(GPT) 라이브러리의 display() 메서드를 사용하여 광고 슬롯을 등록하고 표시합니다. 그러나 광고 콘텐츠가 로드되는 시점을 더욱 정밀하게 제어하기 위해 이러한 작업을 분리하는 것이 바람직하거나 심지어 필요할 수도 있습니다. 예를 들어 동의 관리 플랫폼으로 작업하거나 사용자 작업의 결과로 광고 콘텐츠를 요청하는 경우입니다.

이 가이드에서는 GPT에서 제공하는 메커니즘에 따라 광고 콘텐츠 로드를 제어하고 주문형으로 새 광고 콘텐츠를 가져옵니다. 이 예의 전체 코드는 이벤트 기반 요청 샘플 페이지에서 확인할 수 있습니다.

광고 로드 관리

기본적으로 display() 메서드의 동작은 광고 콘텐츠를 등록, 요청 및 광고 슬롯에 렌더링하는 것입니다. 광고 콘텐츠의 자동 요청 및 렌더링은 PubAdsService.disableInitialLoad() 메서드를 통해 중지할 수 있습니다.

초기 로드가 사용 중지되면 display() 호출이 광고 슬롯만 등록합니다. 두 번째 조치를 취할 때까지 광고 콘텐츠가 로드되지 않습니다. 이를 통해 광고 요청 시점을 정확하게 제어할 수 있습니다.

의도하지 않은 광고 요청을 방지하려면 서비스를 사용 설정하기 전과 display()를 호출하기 전에 disableInitialLoad()를 호출해야 합니다.

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="Request GPT ads based on events." />
    <title>Event-based ad requests</title>
    <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
    <script>
      window.googletag = window.googletag || { cmd: [] };

      googletag.cmd.push(() => {
        // Define the ad slot.
        googletag
          .defineSlot("/6355419/Travel", [728, 90], "div-for-slot")
          .setTargeting("test", "event")
          .addService(googletag.pubads());

        // Disable initial load.
        // This prevents GPT from automatically fetching ads when display is called.
        googletag.pubads().disableInitialLoad();
        googletag.enableServices();
      });
    </script>
    <style></style>
  </head>
  <body>
    <div id="div-for-slot" style="width: 300px; height: 250px"></div>
    <script>
      googletag.cmd.push(() => {
        // Register the ad slot.
        // An ad will not be fetched until refresh is called.
        googletag.display("div-for-slot");

        // Register click event handler.
        document.getElementById("showAdButton").addEventListener("click", () => {
          googletag.cmd.push(() => {
            googletag.pubads().refresh();
          });
        });
      });
    </script>
  </body>
</html>

이 예에서는 초기 로드가 사용 중지되어 display()가 호출될 때 광고 요청이 없고 광고 콘텐츠가 렌더링되지 않습니다. 슬롯이 광고를 수락하고 표시할 준비가 되었지만 슬롯이 새로고침될 때까지 광고 요청이 이루어지지 않습니다.

새로고침

PubAdsService.refresh() 메서드는 슬롯을 새 광고 콘텐츠로 채우는 데 사용됩니다. 이 메서드는 (disableInitialLoad()로 인해) 아직 콘텐츠를 로드하는 슬롯에서 사용하거나 이미 채워진 슬롯의 콘텐츠를 대체하는 데 사용할 수 있습니다. 그러나 display()를 호출하여 등록된 슬롯만 새로고침할 수 있습니다.

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="Request GPT ads based on events." />
    <title>Event-based ad requests</title>
    <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
    <script>
      window.googletag = window.googletag || { cmd: [] };

      googletag.cmd.push(() => {
        // Define the ad slot.
        googletag
          .defineSlot("/6355419/Travel", [728, 90], "div-for-slot")
          .setTargeting("test", "event")
          .addService(googletag.pubads());

        // Disable initial load.
        // This prevents GPT from automatically fetching ads when display is called.
        googletag.pubads().disableInitialLoad();
        googletag.enableServices();
      });
    </script>
    <style></style>
  </head>
  <body>
    <div id="div-for-slot" style="width: 300px; height: 250px"></div>
    <button id="showAdButton">Show/Refresh Ad</button>
    <script>
      googletag.cmd.push(() => {
        // Register the ad slot.
        // An ad will not be fetched until refresh is called.
        googletag.display("div-for-slot");

        // Register click event handler.
        document.getElementById("showAdButton").addEventListener("click", () => {
          googletag.cmd.push(() => {
            googletag.pubads().refresh();
          });
        });
      });
    </script>
  </body>
</html>

이 수정된 예에서는 사용자가 '광고 표시/새로고침' 버튼을 클릭하면 refresh() 메서드가 호출됩니다. 이렇게 하면 새 광고 콘텐츠를 가져와 등록된 슬롯에 로드하라는 요청이 트리거되어 기존 콘텐츠를 덮어씁니다.

위 예에서 refresh() 메서드는 매개변수 없이 호출되므로 등록된 모든 광고 슬롯을 새로고침하는 효과가 있습니다. 그러나 슬롯 배열을 refresh() 메서드에 전달하여 특정 광고 슬롯을 새로고침할 수도 있습니다. 이에 관한 예는 광고 슬롯 새로고침 샘플을 참고하세요.

권장사항

refresh()를 사용할 때 준수해야 하는 몇 가지 권장사항이 있습니다.

너무 빨리 새로고침하지 마세요.

광고 슬롯을 너무 빨리 새로고침하면 광고 요청이 제한될 수 있습니다. 이를 방지하려면 슬롯을 30초마다 두 번 이상 새로고침하지 않는 것이 좋습니다.
clear()를 불필요하게 호출하지 않음

광고 슬롯을 새로고침할 때 PubAdsService.clear()를 먼저 호출하지 마세요. 이는 refresh()가 광고 콘텐츠가 이전에 로드되었는지와 관계없이 지정된 슬롯의 콘텐츠를 대체하므로 필요하지 않습니다. refresh()를 호출하기 직전에 clear()를 호출하면 빈 슬롯이 사용자에게 표시되는 시간만 증가합니다.

조회 가능한 광고 슬롯만 새로고침

refresh()를 사용하여 볼 수 없는 광고 슬롯의 콘텐츠를 교체하면 ActiveView 비율이 크게 낮아질 수 있습니다. 아래 예에서처럼 ImpressionViewableEvent를 통해 광고 슬롯이 조회 가능한 시점을 파악할 수 있습니다.

googletag.cmd.push(function() {
  var REFRESH_KEY = 'refresh';
  var REFRESH_VALUE = 'true';

  googletag.defineSlot('/6355419/Travel',[728, 90], 'div-for-slot')
      .setTargeting(REFRESH_KEY, REFRESH_VALUE)
      .setTargeting('test', 'event')
      .addService(googletag.pubads());

  // Number of seconds to wait after the slot becomes viewable.
  var SECONDS_TO_WAIT_AFTER_VIEWABILITY = 60;

  googletag.pubads().addEventListener('impressionViewable', function(event) {
    var slot = event.slot;
    if (slot.getTargeting(REFRESH_KEY).indexOf(REFRESH_VALUE) > -1) {
      setTimeout(function() {
        googletag.pubads().refresh([slot]);
      }, SECONDS_TO_WAIT_AFTER_VIEWABILITY * 1000);
    }
  });

  googletag.enableServices();
});