広告の読み込みと更新を制御する

基本的なコンセプトの例として Google パブリッシャータグ（GPT）ライブラリの display() メソッドが使用されているスロットを登録して表示できます。ただし、広告コンテンツの読み込みタイミングをより正確に制御するために、これらのアクションを分離することが望ましい場合や、分離が必要な場合もあります。たとえば、ユーザーに応じて広告コンテンツをリクエストしたりできます。

このガイドでは、Google Chat で実行できる GPT の広告コンテンツの読み込みを制御し、新しい広告コンテンツをオンデマンドで取得する。この例の完全なコードは、イベントベースのリクエストのサンプルページで確認できます。

広告の読み込みを管理する

デフォルトでは、display() メソッドの動作は次のようになります。広告スロットで広告コンテンツの登録、リクエスト、レンダリングを行う。広告コンテンツの自動リクエストとレンダリングは、PubAdsService.disableInitialLoad() メソッドを使用して無効にできます。

初期読み込みを無効にした場合、display() の呼び出しでは広告スロットのみが登録されます。 2 回目の操作が行われるまで、広告コンテンツは読み込まれません。これにより、広告リクエストのタイミングを正確に制御できます。

意図しない広告リクエストが発生しないようにするには、サービスを有効にする前と 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"
      crossorigin="anonymous"
    ></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");
      });
    </script>
  </body>
</html>

この例では、初期読み込みが無効になっているため、display() が呼び出されたときに広告リクエストが実行されず、広告コンテンツがレンダリングされません。スロットは広告を受信して表示する準備ができていますが、スロットが更新されるまで広告リクエストは行われません。

更新

PubAdsService.refresh() メソッドは、スロットまたはスロットに新しい広告コンテンツを入力するために使用します。このメソッドは、指定されたスロットに対してまだコンテンツを読み込んでいないか（disableInitialLoad() が原因で）、または自動的に挿入されます。ただし Chronicle SOAR が 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"
      crossorigin="anonymous"
    ></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 に 1 回より頻繁に更新しないようにします。秒です。
clear() を不必要に呼び出さない

広告スロットを更新する際に、 PubAdsService.clear()。refresh() は、以前に読み込まれた広告コンテンツがあるかどうかに関係なく、指定されたスロットのコンテンツを置き換えるため、これは不要です。すぐに clear() に発信しています refresh() を呼び出す前に、空白スロットがある時間を増やすだけです。ユーザーに表示されます

視認範囲の広告スロットのみを更新

refresh() を使用して視認範囲外の広告スロットのコンテンツを置き換えると、アクティブビュー率が大幅に低下する可能性があります。「 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();
});

広告の読み込みと更新を制御する

広告の読み込みを管理する

更新

ベスト プラクティス

ベストプラクティス