ご希望の DAI ソリューションを選択する
連続広告配信 DAI
IMA SDK を使用すると、ウェブサイトやアプリにマルチメディア広告を簡単に統合できます。
IMA SDK では、あらゆる場所から広告を VAST 準拠 アプリでの広告再生の管理を行えます。
IMA DAI SDK を使用すると、アプリから VOD やライブ コンテンツです。SDK は結合された動画ストリームを返すので、 管理画面で広告やコンテンツ動画の切り替えを管理する必要は 。
このガイドでは、IMA を使用してライブ DAI Pod Serving ストリームを再生する方法について説明します。 CAF 向け DAI SDK
このガイドを使用する前に、 Chromecast Application Framework のウェブ レシーバー 構成されます。このガイドは、CAF レシーバーのコンセプト、 メッセージ インターセプタ および mediaInformation オブジェクトの使用に精通していること、 Cast Command and Control ツール CAF 送信者をエミュレートします。
IMA DAI 連続配信広告を使用するには、広告連続配信パートナーと提携する必要があります。 には アド マネージャー 360(上級) あります。アド マネージャー アカウントをお持ちの場合は、アカウント マネージャーに 詳しく見ていきますアド マネージャーへのお申し込みについて詳しくは、 アド マネージャー ヘルプセンターをご覧ください。
他のプラットフォームとの統合や IMA の使用について詳しくは、 Interactive Media Ads SDK をご覧ください。
IMA DAI 連続配信広告の概要
IMA CAF DAI SDK を使用して連続広告配信を実装するには、主に次の 2 つのコンポーネントを使用します。 これらは、このガイドで説明する
StreamRequest
: Google の広告サーバーへのストリーム リクエストを定義するオブジェクト。 リクエストでは、ネットワーク コード、カスタム アセットキー、オプションの API キーを指定します。 その他の省略可能なパラメータも含まれます。StreamManager
: 動画ストリームと IMA DAI 間の通信を処理するオブジェクト (トラッキング ping の呼び出しや、 あります。
前提条件
- 以下を満たす Cast Developer Console アカウント 登録済みのテストデバイスです。
- ホスト型のウェブ レシーバー アプリ 登録され、それをホストするために修正できるもの、 同じコードを使用します
- ウェブ受信アプリを使用するように構成された送信アプリ。対象: Cast コマンド&コントロール ツールを送信者として使用します。
送信者の MediaInfo オブジェクトを構成する
まず、送信側のアプリの
MediaInfo
オブジェクト
次のフィールドを含めます。
フィールド | 目次 | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|
contentId
|
このメディア アイテムの一意の識別子です。
CONTENT_ID |
||||||||||
contentUrl
|
省略可。DAI ストリームの読み込みに失敗した場合に再生する代替ストリーム URL。
BACKUP_STREAM_URL |
||||||||||
contentType
|
省略可。コンテンツのバックアップ ストリームの mimetype。DASH の場合のみ必要
ストリームをご覧ください。
CONTENT_STREAM_MIMETYPE |
||||||||||
streamType
|
この値に使用される文字列リテラルまたは定数は送信者によって異なります 説明します。 | ||||||||||
customData
|
customData フィールドには、追加の Key-Value ストアが含まれます。
必須項目です。
|
作業の開始に役立つコードサンプルを次に示します。
ウェブ
ウェブキャスト センダーでこれらの値を設定するには、まず
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 = {
manifestUrl: "MANIFEST_URL",
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
ウェブキャスト センダーでこれらの値を設定するには、まず MediaInfo オブジェクト 次に必要なデータを入力してから、 ウェブへの読み込みリクエスト 受信します。
JSONObject customData = new JSONObject()?
.put("manifestUrl", "MANIFEST_URL")
.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)
ウェブキャスト センダーでこれらの値を設定するには、まず
GCKMediaInformation
必要なデータでオブジェクトを取得し、
ウェブ レシーバーにリクエストします。
NSURL url = [NSURL URLWithString:@"BACKUP_STREAM_URL"];
NSDictionary *customData = @{
@"manifestUrl": @"MANIFEST_URL",
@"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)
ウェブキャスト センダーでこれらの値を設定するには、まず
GCKMediaInformation
必要なデータでオブジェクトを取得し、
ウェブ レシーバーにリクエストします。
let url = URL.init(string: "BACKUP_STREAM_URL")
guard let mediaURL = url else {
print("invalid mediaURL")
return
}
let customData = [
"liveConfigID": "MANIFEST_URL",
"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 Media] タブをクリックして、 LOAD に設定します。次に、テキスト領域の JSON データを置き換えます。 次の JSON を使用します。
{
"media": {
"contentId": "CONTENT_ID",
"contentUrl": "BACKUP_STREAM_URL",
"contentType": ""CONTENT_STREAM_MIMETYPE"",
"streamType": "LIVE",
"customData": {
"liveConfigID": "MANIFEST_URL",
"networkCode": "NETWORK-CODE",
"customAssetKey": "CUSTOM_ASSET_KEY",
"oAuthToken": "API_KEY"
}
}
}
このカスタム読み込みリクエストを受信側に送信して、残りの部分をテストできます。 できます。
基本的な CAF レシーバーを作成する
CAF SDK Custom Web Receiver を参照して、カスタム ウェブ レシーバーを作成する ガイドをご覧ください。
レシーバーのコードは次のようになります。
<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 をインポートしてプレーヤー マネージャーを入手する
IMA DAI SDK for CAF をウェブ レシーバーにインポートするためのスクリプトタグを追加します。 スクリプトが 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 Stream Manager を初期化する
IMA Stream Manager を初期化します。
<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>
ストリーム マネージャー読み込みインターセプタを作成する
メディア アイテムを CAF に渡す前に、 LOAD メッセージ インターセプタ。
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
関数を完成させて、Pod サービング ストリームに基づく
CAF 読み込みリクエストで出力されます。
/**
* 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 streamRequest = new google.ima.cast.dai.api.PodStreamRequest();
const customData = castRequest.media.customData;
streamRequest.customAssetKey = customData.customAssetKey;
streamRequest.networkCode = customData.networkCode;
streamRequest.apiKey = customData.apiKey;
return streamRequest;
};
コンテンツ URL をマニフェスト URL とストリーム ID に置き換える
ストリーミング リクエストが成功した場合は、streamManager.getStreamId()
を使用して以下を行います。
ストリームの ID を取得して manifestUrl に挿入します。
[[STREAMID]]
。次に、既存の contentUrl
を新しいものに置き換えます。
manifestUrl
を使用して、合成された連続配信広告を使用して CAF がライブ配信を再生できるようにします。
/**
* 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.');
const media = castRequestWithPodStreamData.media;
const manifestUrl = media.customData.manifestUrl || "";
if (manifestUrl) {
console.log('Replacing the contentURL with the manifest URL and stream ID');
const streamId = streamManager.getStreamId();
castRequestWithPodStreamData.media.contentUrl = manifestUrl.replace('[[STREAMID]]', streamId);
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 SDK for CAF