スキップ可能なモバイル広告

Chrome 53 と iOS 10 以降、Android と iPhone はインライン動画再生とミュートされた自動再生をサポートしています。このガイドでは、この機能に必要な単純なサンプルに対する変更について説明します。

スキップ可能な広告を使用するには、動画プレーヤーでコンテンツを(全画面表示ではなく)インライン再生し、iPhone でカスタム再生を無効にする必要があります。Android Chrome では、カスタム再生は常に無効になっています。シンプルなサンプルの HTML と JavaScript を次のように変更します。

index.html

<video id="contentElement" playsinline>
  <source src="https://storage.googleapis.com/gvabox/media/samples/stock.mp4">
</video>

ads.js

google.ima.settings.setDisableCustomPlaybackForIOS10Plus(true);
adDisplayContainer =
    new google.ima.AdDisplayContainer(containerElement, contentVideoElement);
adsLoader = new google.ima.AdsLoader(adDisplayContainer);

HTML の変更により、コンテンツが iPhone のデフォルトの全画面プレーヤーではなく、iPhone のインライン動画プレーヤーで再生され、ミュート状態で開始されるようになります。JavaScript の変更により、IMA SDK では iPhone とは異なりコンテンツ プレーヤーを再利用するのではなく、独自の動画プレーヤーを使用して広告を再生できるようになります。