AMP と広告

はじめに

プレロール広告を含む広告は、AMP で使用されるプレーヤーでも動作します。広告プラグインとその設定をプレーヤー構成に追加するだけです。静的広告タグを使用した基本的な設定については、本ドキュメント内の静的広告タグを使用した基本設定セクションの手順に従ってください。

動的な情報を広告リクエストに追加するためにマクロを使用したい場合があります。この方法の詳細については、本ドキュメント内の広告リクエストでマクロを使用するセクションを参照してください。

AMP ではクライアントサイド同意（consent）を使用でき、ユーザーはオンライン体験をより細かく管理できます。詳細は AMP-consent と広告セクションを参照してください。

AMP では、有効な AMP ページに追加できる内容が非常に厳しく制限されています。詳細は Video Cloud 動画を使用した AMP ドキュメントに記載されています。例えば、通常のように amp-brightcove タグに id を追加し、script ブロックで IMA3 プラグインを設定する方法は使用できません。そのため、広告の設定は Studio または Player Management API を使用してプレーヤー構成内で行う必要があります。

静的広告タグを使用した基本設定

静的広告タグを使用してプレーヤーを設定するには、以下の手順を行います：

プレーヤーを作成する。
ステップ・バイ・ステップ：広告の実装ドキュメントの 1〜15 の手順に従い、静的広告タグを使用して広告を設定する。
Video Cloud 動画を使用した AMP ドキュメントの前半に記載されている手順に従い、AMP を使用するようプレーヤーを設定する。

AMP プレーヤーのコードをページに配置すると、動画と共に広告が再生されます。

広告リクエストでマクロを使用する

記事固有の値を広告サーバーリクエストに含めたい場合、カスタムデータをプレーヤープラグインに渡すことができます。{mediainfo.tags} のような動画メタデータ用マクロは通常どおり使用できます（動画メタデータマクロの一覧は IMA3 プラグインによる広告 ドキュメント内の「広告マクロと serverUrl」を参照）。

ただし、{pageVariable.*} マクロを使用するには追加手順が必要です。AMP プレーヤーは iframe 内で動作するためです。

まず、Brightcove プレーヤーの query_string_to_window 設定を使用して、クエリパラメータを解析するようプレーヤーを設定します。すべてのクエリパラメータをグローバル名前空間に追加するには、プレーヤー設定に次を追加します：

      "query_string_to_window": {
        "target": "qsParams"
      }

qsParams はパラメータが格納されるオブジェクト名です。名前は任意に変更でき、その場合はマクロで使用する名前も変更する必要があります。

次に、<amp-brightcove> の埋め込みコードに必要な数だけ data-param-* パラメータを追加してデータを渡します。例：

data-param-ad-id="prerollonly"
      data-param-site-section="celebrity"
      data-param-post-id="A12345"

プレーヤーの iframe 内では、これらのデータがターゲットオブジェクトのキャメルケースのプロパティとして利用できます：

window.qsParams.adId
      window.qsParams.siteSection
      window.qsParams.postId

これらは {pageVariable.*} マクロ内で以下のように使用できます（読みやすくするため改行を追加）：

https://ads.example.com/ad?ad={pageVariable.qsParams.adId}
      &video={mediainfo.id}&article={pageVariable.qsParams.postId}
      &section={pageVariable.qsParams.siteSection}

Player Management API を使用してプレーヤー設定を更新する手順については、プレーヤー設定 - プレーヤー設定を更新するを参照してください。

AMP-consent と広告

AMP ではクライアントサイドの同意管理（consent）を利用でき、ユーザーにオンライン体験をより細かく管理するための追加のコントロールを提供できます。AMP ページが AMP-consent を使ってユーザー同意を管理しており、かつプレーヤーで広告を使用している場合、同意状況に応じてプレーヤーの広告リクエストを調整したいことがあります。その場合、amp-brightcove 要素に次の属性を追加してください：

data-block-on-consent="_till_responded"

これにより、ユーザーが同意するか拒否するまでプレーヤーの読み込みが遅延されます。2 回目以降など、同意状態がすでに分かっているページでは通常どおり遅延なく読み込まれます。

広告設定

もっともシンプルに AMP と広告を実装する方法は、Brightcove プレーヤーの標準 IMA 広告統合を使用して Google Ad Manager と連携することです。この場合、同意が不明または得られていないとき、広告リクエストには npa=1 を追加する必要があります。これを行うには、プレーヤーの AMP Support プラグインのオプションに次を追加します：

"imaAddNpa": true

これにより、以下のように自動的に広告サーバー URL に値が追加されます：

ampSupport プラグイン（videojs-amp-support）は広告の表示そのものを停止するものではありません。同意の対象となるのは、個人データの使用および保持に関するものです。

広告サーバー URL に他の変更を加える場合、同意状態はプレーヤーの iframe に 3 つのクエリパラメータとして設定されます：

ampInitialConsentState：同意が許可・拒否・不明などの状態
ampConsentSharedData：同意ベンダーから渡される JSON 文字列
ampInitialConsentValue：同意ベンダーから渡される同意文字列

同意状態は AMP で次の整数として定義されています：

SUFFICIENT（同意あり）: 1
INSUFFICIENT（同意拒否）: 2
UNKNOWN_NOT_REQUIRED（同意不要）: 3
UNKNOWN（不明）: 4

プレーヤー設定を更新し、プレーヤー iframe のクエリパラメータを JavaScript 変数として利用できるようにするには、JSON エディタで以下を追加します：

"query_string_to_window": {"target": "queryStringParams"}

以下は UI のスクリーンショットです：

その後、広告サーバーリクエストに同意クエリパラメータをマクロまたは関数として使用できます。

マクロの例

"adserverURL": "https://ads.example.com/ad?consent={pageVariable.queryStringParams.ampInitialConsentState}&consentString={pageVariable.queryStringParams.ampInitialConsentValue}"

関数の例

次のように設定することで、ad server URL を関数で動的に指定できます：

videojs.registerPlugin('setAdUrl', function() {
          this.ima3.settings.serverUrl = function(callback) {
            if (window.queryStringParams.ampInitialConsentState === '1') {
              // 同意あり
              callback('https://ads.example.com/adwithconsent?string={pageVariable.queryStringParams.ampInitialConsentValue}');
            } else {
              // 別の広告を使用
              callback('https://ads.example.com/basicad');
            }
          };
        });

自動再生（Autoplay）

自動再生を使用している場合、ブラウザのコンソールに次の警告が表示されることがあります：

Brightcove プレーヤー設定内で autoplay を設定している場合、この警告が表示されます。警告を回避するには、プレーヤー設定内で「autoplay」を false にするか、設定自体を削除してください。

AMP のルールでは、AMP 内のプレーヤーは、ユーザー操作による再生開始、または AMP が管理する autoplay のどちらかによってのみ再生できます。AMP 管理の autoplay を使用するには、amp-brightcove 要素に autoplay 属性を追加します。

Brightcove では、AMP ページ専用のプレーヤーを作成し、そのプレーヤー設定内では autoplay を使用しないことを推奨しています。自動再生が必要な場合は AMP の autoplay 属性で管理してください。