ダイナミック広告挿入（DAI）を使用して、広告でコンテンツ動画ストリームの収益化を開始します。
関心のある DAI ソリューションを選択する
Pod Serving DAI
IMA SDK を使用すると、マルチメディア広告をウェブサイトやアプリに簡単に統合できます。
IMA SDK は、VAST 準拠のあらゆる広告サーバーから広告をリクエストし、アプリでの広告再生を管理できます。
IMA DAI SDK を使用すると、アプリは VOD またはライブ コンテンツの広告とコンテンツ動画のストリーム リクエストを行います。SDK から結合された動画ストリームが返されるため、アプリ内で広告とコンテンツの動画を切り替える必要はありません。
このガイドでは、CAF 用 IMA DAI SDK を使用して DAI Pod Serving ストリームを再生する方法を説明します。
このガイドを使用する前に、Chromecast アプリケーション フレームワークの Web Receiver プロトコルを理解しておいてください。このガイドは、メッセージ インターセプタや mediaInformation オブジェクトなど、CAF レシーバのコンセプトを理解しており、Cast Command and Control ツールを使用して CAF 送信側をエミュレートすることに慣れていることを前提としています。
IMA DAI Pod Serving を使用するには、Pod Serving パートナーと提携し、アド マネージャー 360 アドバンス アカウントを所有している必要があります。アド マネージャー アカウントをお持ちの場合は、詳細についてアカウント マネージャーにお問い合わせください。アド マネージャーへの登録について詳しくは、アド マネージャー ヘルプセンターをご覧ください。
他のプラットフォームとの統合や IMA クライアントサイド SDK の使用については、Interactive Media Ads SDK をご覧ください。
IMA DAI Pod Serving の概要
IMA CAF DAI SDK を使用してポッド サービングを実装するには、次の 2 つの主要コンポーネントが必要です。このガイドでは、これらのコンポーネントについて説明します。
StreamRequest: Google の広告サーバーへのストリーム リクエストを定義するオブジェクト。リクエストでは、ネットワーク コード、カスタム アセットキー、省略可能な API キー、その他の省略可能なパラメータを指定します。StreamManager: 動画ストリームと IMA DAI SDK 間の通信を処理するオブジェクト（トラッキング ピングの発行、ストリーム イベントのパブリッシャーへの転送など）。
前提条件
- テストデバイスが登録された Cast Developer Console アカウント。
- Cast デベロッパー コンソールに登録され、このガイドで提供されるコードをホストするように変更できる、ホスト型のウェブ レシーバ アプリ。
- ウェブ レシーバー アプリを使用するように構成された送信アプリ。この例では、送信元として Cast Command and Control ツールを使用します。
送信側の MediaInfo オブジェクトを構成する
まず、送信側アプリの MediaInfo オブジェクトを構成して、次のフィールドを含めます。
| フィールド | 目次 | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
contentId
|
このメディア アイテムの一意の識別子。 CONTENT_ID |
||||||||||
contentUrl
|
省略可。DAI ストリームの読み込みに失敗した場合に再生するバックアップ ストリーム URL。 BACKUP_STREAM_URL |
||||||||||
contentType
|
省略可。コンテンツ バックアップ ストリームの MIME タイプ。DASH ストリームでのみ必要です。 CONTENT_STREAM_MIMETYPE |
||||||||||
streamType
|
この値に使用される文字列リテラルまたは定数は、送信側プラットフォームによって異なります。 | ||||||||||
customData
|
customData フィールドには、追加の必須フィールドの Key-Value ストアが含まれます。このサンプルには、DAI ストリーム パラメータが含まれています。本番環境のアプリでは、代わりに、キャスト レシーバー アプリがサーバーサイド リクエストでこれらのパラメータを取得するために使用する ID を渡すこともできます。
|
以下に、作業を開始するうえで役立つコードサンプルをいくつか紹介します。
ウェブ
Cast ウェブ送信側でこれらの値を構成するには、まず必要なデータを含む MediaInfo オブジェクトを作成し、ウェブ受信側に読み込みリクエストを送信します。
// Create mediaInfo object
const mediaInfo = new chrome.cast.media.MediaInfo("CONTENT_ID");
mediaInfo.contentUrl = "BACKUP_STREAM_URL";
mediaInfo.contentType = "CONTENT_STREAM_MIMETYPE";
mediaInfo.streamType = chrome.cast.media.StreamType.LIVE;
mediaInfo.customData = {
daiStreamType: "DAI_STREAM_TYPE",
networkCode: "NETWORK-CODE",
customAssetKey: "CUSTOM_ASSET_KEY",
apiKey: "API_KEY"
};
// Make load request to cast web receiver
const castSession = cast.framework.CastContext.getInstance().getCurrentSession();
const request = new chrome.cast.media.LoadRequest(mediaInfo);
castSession.loadMedia(request).then(
() => { console.log('Load succeed'); },
(errorCode) => { console.log('Error code: ' + errorCode); });
Android
Cast ウェブ送信側でこれらの値を構成するには、まず必要なデータを含む MediaInfo オブジェクトを作成し、ウェブ受信側に読み込みリクエストを送信します。
JSONObject customData = new JSONObject()?
.put("daiStreamType", "DAI_STREAM_TYPE")
.put("networkCode", "NETWORK-CODE")
.put("customAssetKey", "CUSTOM_ASSET_KEY")
.put("apiKey", "API_KEY");
MediaInfo mediaInfo = MediaInfo.Builder("CONTENT_ID")
.setContentUrl("BACKUP_STREAM_URL")
.setContentType("CONTENT_STREAM_MIMETYPE")
.setStreamType(MediaInfo.STREAM_TYPE_LIVE)
.setCustomData(customData)
.build();
RemoteMediaClient remoteMediaClient = mCastSession.getRemoteMediaClient();
remoteMediaClient.load(new MediaLoadRequestData.Builder().setMediaInfo(mediaInfo).build());
iOS（Obj-C）
Cast ウェブ送信側でこれらの値を構成するには、まず必要なデータを含む GCKMediaInformation オブジェクトを作成し、ウェブ受信側に読み込みリクエストを送信します。
NSURL url = [NSURL URLWithString:@"BACKUP_STREAM_URL"];
NSDictionary *customData = @{
@"daiStreamType": @"DAI_STREAM_TYPE",
@"networkCode": @"NETWORK-CODE",
@"customAssetKey": @"CUSTOM_ASSET_KEY",
@"apiKey": @"API_KEY"};
mediaInfoBuilder.customData = customData;
GCKMediaInformationBuilder *mediaInfoBuilder =
[[GCKMediaInformationBuilder alloc] initWithContentID: @"CONTENT_ID"];
mediaInfoBuilder.contentURL = url;
mediaInfoBuilder.contentType = @"CONTENT_STREAM_MIMETYPE";
mediaInfoBuilder.streamType = GCKMediaStreamTypeLive;
mediaInfoBuilder.customData = customData;
self.mediaInformation = [mediaInfoBuilder build];
GCKRequest *request = [self.sessionManager.currentSession.remoteMediaClient loadMedia:self.mediaInformation];
if (request != nil) {
request.delegate = self;
}
iOS - Swift
Cast ウェブ送信側でこれらの値を構成するには、まず必要なデータを含む GCKMediaInformation オブジェクトを作成し、ウェブ受信側に読み込みリクエストを送信します。
let url = URL.init(string: "BACKUP_STREAM_URL")
guard let mediaURL = url else {
print("invalid mediaURL")
return
}
let customData = [
"daiStreamType": "DAI_STREAM_TYPE",
"networkCode": "NETWORK-CODE",
"customAssetKey": "CUSTOM_ASSET_KEY",
"region": "API_KEY"
]
let mediaInfoBuilder = GCKMediaInformationBuilder.init(contentId: "CONTENT_ID")
mediaInfoBuilder.contentURL = mediaUrl
mediaInfoBuilder.contentType = @"CONTENT_STREAM_MIMETYPE"
mediaInfoBuilder.streamType = GCKMediaStreamType.Live
mediaInfoBuilder.customData = customData
mediaInformation = mediaInfoBuilder.build()
guard let mediaInfo = mediaInformation else {
print("invalid mediaInformation")
return
}
if let request = sessionManager.currentSession?.remoteMediaClient?.loadMedia
(mediaInfo) {
request.delegate = self
}
CAC ツール
Cast Command and Control ツールでこれらの値を構成するには、[メディアを読み込む] タブをクリックし、カスタム読み込みリクエスト タイプを LOAD に設定します。次に、テキスト領域の JSON データを次の JSON に置き換えます。
{
"media": {
"contentId": "CONTENT_ID",
"contentUrl": "BACKUP_STREAM_URL",
"contentType": ""CONTENT_STREAM_MIMETYPE"",
"streamType": "LIVE",
"customData": {
"daiStreamType": "DAI_STREAM_TYPE",
"networkCode": "NETWORK-CODE",
"customAssetKey": "CUSTOM_ASSET_KEY",
"oAuthToken": "API_KEY"
}
}
}
このカスタム ロード リクエストをレシーバに送信して、残りの手順をテストできます。
基本的な CAF レシーバーを作成する
CAF SDK カスタム ウェブ受信者ガイドの説明に沿って、カスタム ウェブ レシーバーを作成します。
レシーバーのコードは次のようになります。
<html>
<head>
<script
src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js">
</script>
</head>
<body>
<cast-media-player></cast-media-player>
<script>
// ...
</script>
</body>
</html>
IMA DAI SDK をインポートしてプレーヤー マネージャーを取得する
スクリプトタグを追加して、CAF 用の IMA DAI SDKr をウェブレシーバーにインポートします。これは、スクリプトが CAF を読み込んだ直後に行います。スクリプトタグで、レシーバーを開始する前に、レシーバー コンテキストとプレーヤー マネージャーを定数として保存します。
<html>
<head>
<script
src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
<script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
<cast-media-player></cast-media-player>
<script>
const castContext = cast.framework.CastReceiverContext.getInstance();
const playerManager = castContext.getPlayerManager();
castContext.start();
</script>
</body>
</html>
IMA ストリーム マネージャーの初期化
IMA ストリーム マネージャーを初期化します。
<html>
<head>
<script type="text/javascript"
src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
<script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
<cast-media-player></cast-media-player>
<script>
const castContext = cast.framework.CastReceiverContext.getInstance();
const playerManager = castContext.getPlayerManager();
const streamManager = new google.ima.cast.dai.api.StreamManager();
castContext.start();
</script>
</body>
</html>
Stream Manager ロード インターセプタを作成する
メディア アイテムが CAF に渡される前に、読み込みメッセージ インターセプタでストリーム リクエストを作成します。
const castContext = cast.framework.CastReceiverContext.getInstance();
const playerManager = castContext.getPlayerManager();
const streamManager = new google.ima.cast.dai.api.StreamManager();
/**
* Creates a livestream request object for a Pod Serving stream.
* @param {!LoadRequestData} castRequest The request object from the cast sender
* @return {StreamRequest} an IMA stream request
*/
const createStreamRequest = (castRequest) => { /* ... */};
/**
* Initates a DAI stream request for the final stream manifest.
* @param {!LoadRequestData} castRequest The request object from the cast sender
* @return {Promise<LoadRequestData>} a promise that resolves to an updated castRequest, containing the DAI stream manifest
*/
const createDAICastRequest = (castRequest) => {
return streamManager.requestStream(castRequest, createStreamRequest(castRequest))
.then((castRequestWithPodStreamData) => {
console.log('Successfully made DAI stream request.');
// ...
return castRequestWithPodStreamData;
})
.catch((error) => {
console.log('Failed to make DAI stream request.');
// CAF will automatically fallback to the content URL
// that it can read from the castRequest object.
return castRequest;
});
};
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, createDAICastRequest);
castContext.start();
ストリーム リクエストを作成する
createStreamRequest 関数を完成させ、CAF 読み込みリクエストに基づいて Pod Serving ストリームを作成します。
/**
* Creates a livestream request object for a Pod Serving stream.
* @param {!LoadRequestData} castRequest The request object from the cast sender
* @return {StreamRequest} an IMA stream request
*/
const createStreamRequest = (castRequest) => {
const customData = castRequest.media.customData;
let streamRequest;
if (customData.daiStreamType == "LIVE") {
streamRequest = new google.ima.cast.dai.api.PodStreamRequest();
streamRequest.customAssetKey = customData.customAssetKey;
streamRequest.networkCode = customData.networkCode;
streamRequest.apiKey = customData.apiKey;
} else if (customData.daiStreamType == "VOD") {
streamRequest = new google.ima.cast.dai.api.PodVodStreamRequest();
streamRequest.networkCode = customData.networkCode;
streamRequest.apiKey = customData.apiKey;
}
return streamRequest;
};
VTP からステッチされたマニフェストを取得する
ストリーム リクエストが成功した場合は、streamManager.getStreamId() を使用してストリームの ID を取得します。動画テクニカル パートナー（VTP）またはカスタム マニフェスト マニピュレータが、このストリーム ID を使用してマニフェスト URL を取得する手順を提供します。
マニフェスト URL を取得したら、既存の contentUrl を新しい manifestUrl に置き換えます。
最後に、変更したストリーム マニフェストを返す前に、streamManager で loadStreamMetadata メソッドを呼び出し、ストリーム メタデータを安全にリクエストできることを IMA SDK に通知します。この呼び出しは VOD ストリームでのみ必要です。
/**
* Initates a DAI stream request for the final stream manifest.
* @param {!LoadRequestData} castRequest The request object from the cast sender
* @return {Promise<LoadRequestData>} a promise that resolves to an updated castRequest, containing the DAI stream manifest
*/
const createDAICastRequest = (castRequest) => {
return streamManager.requestStream(castRequest, createStreamRequest(castRequest))
.then((castRequestWithPodStreamData) => {
console.log('Successfully made DAI stream request.');
// This is a sample VTP integration. Consult your VTP documentation
// for how to retrieve an ad-stitched stream manifest URL.
const manifestTemplate = "https://.../manifest.m3u8?gam_stream_id=[[STREAMID]]";
const streamId = streamManager.getStreamId();
const manifestUrl = manifestTemplate.replace('[[STREAMID]]', streamId)
// Assign your manifestUrl to the request's content URL.
castRequestWithPodStreamData.media.contentUrl = manifestUrl;
// After generating the manifest URL, VOD streams must notify the
// IMA SDK that it is safe to request ad pod metadata.
// This is only necessary for VOD streams. It is a no-op for
// livestreams, so no conditional is needed.
streamManager.loadStreamMetadata();
return castRequestWithPodStreamData;
})
.catch((error) => {
console.log('Failed to make DAI stream request.');
// CAF will automatically fallback to the content URL
// that it can read from the castRequest object.
return castRequest;
});
};
IMA DAI アセットをクリーンアップする
IMA DAI SDK を使用して Pod サービング ストリームで広告のリクエストと表示が正常に完了したら、Pod サービング セッションの完了後にリソースをクリーンアップすることをおすすめします。StreamManager.destroy() を呼び出して、ストリームの再生を停止し、すべての広告トラッキングを停止して、読み込まれたすべてのストリーム アセットを解放します。