VPAID 2 JavaScript クリエイティブを有効にする
コレクションでコンテンツを整理
必要に応じて、コンテンツの保存と分類を行います。
IMA HTML5 SDK は VPAID 2 JavaScript クリエイティブに対応しています。サポートを有効にする場合、VPAID 2 仕様と IMA SDK による VPAID 2 のサポート方法には、注意すべき 2 つの大きな違いがあります。これらの違いはプレーヤーや SDK の実装コードには影響しませんが、IMA HTML5 SDK でレンダリングされたときにクリエイティブがエラーをスローしたり、期待どおりに動作しなかったりする可能性があるため、VPAID 2 JavaScript クリエイティブの作成者にとっては重要です。
前提条件
このガイドに沿って操作するには、次の要素を含むアプリから始めます。
- IMA HTML5 SDK が統合された HTML5 動画プレーヤー。まだお持ちでない場合は、IMA SDK を設定するをご覧ください。
- VPAID 2 JavaScript クリエイティブを指す VAST 広告タグ URL。
役立つ入門ガイド
VPAID 2 のサポートを有効にする
VPAID 2 JavaScript のサポートを有効にするには、AdDisplayContainer を初期化する前に次のメソッドを呼び出します。
google.ima.settings.setVpaidMode(google.ima.ImaSdkSettings.VpaidMode.ENABLED);
...
var adDisplayContainer = new google.ima.AdDisplayContainer(adContainerElement);
var adsLoader = new google.ima.AdsLoader(adDisplayContainer);
...
使用可能な VPAID モードは次のとおりです。
ENABLED
- デフォルト設定の VPAID 広告を許可します。
INSECURE
- 安全でないモードで VPAID 広告を許可します。詳細については、IFrame のセキュリティと動画プレーヤーのプロキシ要素をご覧ください。
DISABLED
- VPAID 広告が再生されない。リクエストされた広告で VPAID クリエイティブが返された場合、エラーがスローされます。
VPAID モードの詳細については、ImaSdkSettings.VpaidMode の API ドキュメントをご覧ください。
VPAID 2 のサポートに関する注意点
IFrame のセキュリティ
デフォルトでは、IMA SDK は Friendly iframe(同じドメイン)またはページ内スクリプトの代わりにセキュア iframe を使用して、VPAID 2 JavaScript クリエイティブをレンダリングします。つまり、クリエイティブが親ページの DOM にアクセスすることを想定している場合、エラーが発生する可能性があります。代わりに Friendly iFrame で広告をレンダリングするには、次のように ImaSdkSettings.setVpaidMode(...)
を使用します。
adsLoader.getSettings().setVpaidMode(google.ima.ImaSdkSettings.VpaidMode.INSECURE);
動画プレーヤーのプロキシ要素
セキュリティとモバイル機能の適切な動作のため、ENABLED
モードでは、IMA HTML5 SDK は実際の動画要素を広告に提供しません。代わりに、通常の動画要素の機能の多くを模倣したプロキシ要素を提供します。サポートされている API メソッドのみを呼び出す広告クリエイティブの場合、クリエイティブのレンダリングの動作に変更はありません。VpaidMode.INSECURE
モードでは、SDK はプロキシではなく動画プレーヤー要素を提供します。
動画プロキシ要素で使用できるメソッド、リスナー、属性は次のとおりです。
メソッド
addEventListener
canPlayType
load
play
pause
setattribute
addEventListener のイベントタイプ
abort
canplay
canplaythrough
click
durationchange
emptied
ended
error
loadeddata
loadedmetadata
loadstart
pause
play
playing
progress
ratechange
suspend
seeked
seeking
timeupdate
waiting
属性
currentTime
duration
ended
paused
playbackRate
src
type
よくある質問
- iOS または Android SDK で VPAID 2 JavaScript クリエイティブはサポートされていますか?
-
IMA HTML5 SDK は、VPAID 2 JavaScript クリエイティブをサポートする唯一の IMA SDK プラットフォームです。
- これにより、IMA HTML5 SDK で VPAID クリエイティブが有効になりますか?
- はい。IMA HTML5 SDK は VPAID 2 JavaScript クリエイティブに対応しています。
特に記載のない限り、このページのコンテンツはクリエイティブ・コモンズの表示 4.0 ライセンスにより使用許諾されます。コードサンプルは Apache 2.0 ライセンスにより使用許諾されます。詳しくは、Google Developers サイトのポリシーをご覧ください。Java は Oracle および関連会社の登録商標です。
最終更新日 2025-08-31 UTC。
[null,null,["最終更新日 2025-08-31 UTC。"],[[["\u003cp\u003eThe IMA HTML5 SDK supports VPAID 2 JavaScript creatives, requiring a simple setup process outlined in the guide.\u003c/p\u003e\n"],["\u003cp\u003eKey differences exist between the VPAID 2 spec and the IMA SDK's implementation, primarily impacting creative authors.\u003c/p\u003e\n"],["\u003cp\u003eBy default, the SDK uses a secure iframe for rendering VPAID 2 creatives, but you can switch to a friendly iframe for DOM access.\u003c/p\u003e\n"],["\u003cp\u003eA video proxy element is used for security and mobile functionality, providing a subset of video element functionalities to the ad.\u003c/p\u003e\n"],["\u003cp\u003eVPAID 2 JavaScript creative support is currently exclusive to the IMA HTML5 SDK, not available in the iOS or Android SDKs.\u003c/p\u003e\n"]]],[],null,["# Enable VPAID 2 JavaScript creatives\n\nThe IMA HTML5 SDK supports VPAID 2 JavaScript creatives. Enabling support is easy, but there are two differences to be aware of between the [VPAID 2 spec](//iabtechlab.com/standards/video-player-ad-interface-definition-vpaid/) and the way the IMA SDK supports VPAID 2. These differences do not impact player or SDK implementation code, but they are important for VPAID 2 JavaScript creative authors, as creatives may throw errors or not work as expected when rendered by the IMA HTML5 SDK.\n\nPrerequisites\n-------------\n\n- HTML5 video player with the IMA HTML5 SDK integrated. If you don't have one, check out [Set up the IMA SDK](/interactive-media-ads/docs/sdks/html5/client-side).\n- A VAST ad tag URL that points to a VPAID 2 JavaScript creative.\n\nHelpful primers\n---------------\n\n- If you're not familiar with VPAID 2, you can read more at [IAB's VPAID page](//iabtechlab.com/standards/video-player-ad-interface-definition-vpaid/).\n\nEnabling VPAID 2 support\n------------------------\n\nTo enable VPAID 2 JavaScript support, call the following method before initializing your [AdDisplayContainer](/interactive-media-ads/docs/sdks/html5/client-side/reference/class/google.ima.AdDisplayContainer): \n\n```gdscript\n google.ima.settings.setVpaidMode(google.ima.ImaSdkSettings.VpaidMode.ENABLED);\n ...\n var adDisplayContainer = new google.ima.AdDisplayContainer(adContainerElement);\n var adsLoader = new google.ima.AdsLoader(adDisplayContainer);\n ...\n```\n\nThe available VPAID modes are as follows:\n\n- `ENABLED` - Allows VPAID ads with the default settings.\n- `INSECURE` - Allows VPAID ads in insecure mode. For more information, see [IFrame security](#iframe-security) and [Video player proxy element](#proxyelement).\n- `DISABLED` - VPAID ads do not play. If a requested ad returns a VPAID creative, an error is thrown.\n\nFor more information on VPAID modes, see the API documentation for [ImaSdkSettings.VpaidMode](/interactive-media-ads/docs/sdks/html5/client-side/reference/namespace/google.ima.ImaSdkSettings#google.ima.ImaSdkSettings.VpaidMode).\n\nVPAID 2 support caveats\n-----------------------\n\n### IFrame security\n\nBy default, the IMA SDK uses a secure iframe instead of a friendly iframe (same domain) or an in-page script to render VPAID 2 JavaScript creatives. This means that if a creative expects to access the DOM of the parent page, it could potentially cause an error. To render your ad in a friendly iframe instead, you can use `ImaSdkSettings.setVpaidMode(...)` like so: \n\n```text\nadsLoader.getSettings().setVpaidMode(google.ima.ImaSdkSettings.VpaidMode.INSECURE);\n```\n\n\u003cbr /\u003e\n\n### Video player proxy element\n\nFor security and proper mobile functionality, in `ENABLED` mode the IMA HTML5 SDK doesn't provide the actual video element to the ad; instead it provides a proxy element that mimics much of the functionality of the normal video element. For ad creatives that call only supported API methods, there should be no behavior changes in the rendering of the creatives. With `VpaidMode.INSECURE` mode, the SDK provides the video player element instead of the proxy.\n\nHere are the methods, listeners and attributes available on the video proxy element:\n\n#### Methods\n\n- `addEventListener`\n- `canPlayType`\n- `load`\n- `play`\n- `pause`\n- `setattribute`\n\n#### Event types for addEventListener\n\n- `abort`\n- `canplay`\n- `canplaythrough`\n- `click`\n- `durationchange`\n- `emptied`\n- `ended`\n- `error`\n- `loadeddata`\n- `loadedmetadata`\n- `loadstart`\n- `pause`\n- `play`\n- `playing`\n- `progress`\n- `ratechange`\n- `suspend`\n- `seeked`\n- `seeking`\n- `timeupdate`\n- `waiting`\n\n#### Attributes\n\n- `currentTime`\n- `duration`\n- `ended`\n- `paused`\n- `playbackRate`\n- `src`\n- `type`\n\nFAQ\n---\n\nAre VPAID 2 JavaScript creatives supported in the iOS or Android SDKs?\n: The IMA HTML5 SDK is the only IMA SDK platform that currently supports VPAID 2 JavaScript creatives.\n\nDoes this enable VPAID creatives in the IMA HTML5 SDK?\n: Yes, the IMA HTML5 SDK supports VPAID 2 JavaScript creatives."]]