GPT と React

このサンプルでは、Google パブリッシャー タグ（GPT）、React、Next.js を使用した基本的なシングルページ アプリケーション（SPA）の実装を紹介します。

SPA で GPT を使用する際に注意すべき重要なポイントは次のとおりです。

  1. GPT が一度だけ読み込まれるようにする。
  2. 広告リクエストが行われるタイミングは、disableInitialLoad() と refresh() を使用して管理します。詳しくは、広告の読み込みと更新を制御するをご覧ください。
  3. 広告スロットに適用されるターゲティングを管理するには、setTargeting() と clearTargeting() を使用します。詳しくは、Key-Value ターゲティングをご覧ください。
  4. destroySlots() を使用して、不要になった広告スロットをクリーンアップします（コンポーネントがアンロードされたために広告スロットコンテナが削除された場合など）。

実装例