选择您感兴趣的 DAI 解决方案
全方位服务 DAI
本指南将演示如何使用 IMA CAF DAI SDK 播放 DAI 视频流。如果 您想查看或了解已完成的示例集成, 下载示例。
在使用本指南之前,请务必先熟悉 Chromecast
应用框架的网络接收器协议。这个
指南假定您对 CAF 接收器概念有基本的了解,
封邮件
拦截器
和
mediaInformation
对象,并熟悉如何使用 Cast 命令和控件
工具来模拟 CAF 发送器。
要使用 IMA DAI,您必须拥有 Ad Manager 360 账号。如果您有广告 经理账号,请联系您的客户经理了解详情。相关信息 请访问 Ad Manager 帮助中心 中心。
有关与其他平台集成或使用 IMA 客户端 SDK,请参阅互动式媒体广告 SDK。
CAF DAI 概览
使用 IMA CAF DAI SDK 实现 DAI 涉及两个主要组件, 演示:
StreamRequest
: 用于定义向 Google 广告服务器的视频流请求的对象。 流式传输请求主要分为两类:LiveStreamRequest
: 会指定 Asset Key 和可选的 API 密钥以及其他 可选参数。VODStreamRequest
: 指定内容来源 ID、视频 ID 和可选的 API key 以及其他可选参数。
StreamManager
: 用于处理视频流与 IMA DAI 之间的通信的对象 例如触发跟踪 ping,以及将视频流事件转发到 发布商。
前提条件
- 一个 Cast Developer Console 账号,且该账号 已注册的测试设备。
- 托管网络接收器 应用 已在 Cast Developer Console 中注册,并且可进行修改,以便托管 本指南提供的代码
- 配置为使用您的网页接收器应用的发送应用。本示例 使用 Cast 命令和控制工具作为 。
配置发送者的 MediaInfo 对象
首先,配置发送器应用的 MediaInfo 对象来包含 以下字段:
contentId
|
此媒体项的唯一标识符 | |
contentUrl
|
在针对任何一项的 DAI StreamRequest 失败时要加载的后备直播网址 原因 | |
streamType
|
对于直播,此值应设置为 `LIVE`。对于 VOD 视频流 此值应设置为“BUFFERED” | |
customData
|
assetKey
|
仅限直播。标识要加载的直播 |
contentSourceId
|
仅限 VOD 直播。标识包含 请求的视频流。 | |
videoId
|
仅限 VOD 直播。识别请求的视频流 指定的媒体 Feed。 | |
ApiKey
|
检索直播网址时需要使用的可选 API 密钥 IMA DAI SDK | |
senderCanSkip
|
一个布尔值,用于告知接收方设备是否已 能够显示“跳过”按钮,从而支持可跳过的广告 |
若要在 Cast 命令和控制工具中配置这些值,请点击加载
媒体标签页,然后将自定义加载请求类型设置为 LOAD
。然后将
文本区域中的 JSON 数据,其中包含以下 JSON 对象之一:
直播
{
"media": {
"contentId": "bbb",
"contentUrl": "https://storage.googleapis.com/interactive-media-ads/media/bbb.m3u8",
"streamType": "LIVE",
"customData": {
"assetKey": "sN_IYUG8STe1ZzhIIE_ksA",
"ApiKey": "",
"senderCanSkip": true
}
},
"credentials": "testCredentials"
}
视频点播
{
"media": {
"contentId": "tos",
"contentUrl": "https://storage.googleapis.com/interactive-media-ads/media/tos.m3u8",
"streamType": "BUFFERED",
"customData": {
"contentSourceId": "2548831",
"videoId": "tears-of-steel",
"ApiKey": "",
"senderCanSkip": true
}
},
"credentials": "testCredentials"
}
您可以将此自定义加载请求对象发送给接收器, 后续步骤。
创建基本 CAF 接收器
按照 CAF SDK 基本接收器指南,创建一个基本 Web 接收器。
接收器的代码应如下所示:
<html>
<head>
<script type="text/javascript"
src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js">
</script>
</head>
<body>
<cast-media-player></cast-media-player>
<script>
cast.framework.CastReceiverContext.getInstance().start();
</script>
</body>
</html>
导入 IMA DAI SDK 并获取播放器管理器
添加脚本代码,将适用于 CAF 的 IMA DAI SDK 导入您的网页接收器, 在脚本加载 CAF 之后。CAF DAI SDK 为长期有效,因此无需 以设置特定的版本然后在后面的脚本代码中, 将接收器上下文和播放器管理器设置为常量,然后再启动接收器。
<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();
castContext.start();
</script>
</body>
</html>
初始化 IMA 视频流管理器
初始化 CAF DAI SDK 的数据流 管理员。
<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 DAI SDK 使用 CAF 加载消息
拦截器
来发出视频流请求,并将内容网址替换为最终 DAI 视频流。
消息拦截器调用 streamManager.requestStream(),后者用于处理
设置广告插播时间点、请求视频流,以及替换现有
contentURL
。
只能有一个加载消息拦截器,因此如果您的应用需要使用 因此您需要将任何自定义函数整合到 回调。
<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();
const getStreamRequest = (request) => null;
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, (request) => {
return streamManager.requestStream(request, getStreamRequest(request))
.then((request) => {
this.broadcast('Stream request successful.');
return Promise.resolve(request);
})
.catch((error) => {
this.broadcast('Stream request failed.');
return Promise.resolve(request);
});
});
castContext.start();
</script>
</body>
</html>
构建流式传输请求
要完成 CAF DAI 集成,您需要构建自己的视频流
请求
使用来自发送者的 mediaInfo
对象中包含的数据。
<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();
const getStreamRequest = (request) => {
const imaRequestData = request.media.customData;
let streamRequest = null;
if (imaRequestData.assetKey) {
// Live stream
streamRequest = new google.ima.cast.dai.api.LiveStreamRequest();
streamRequest.assetKey = imaRequestData.assetKey;
} else if (imaRequestData.contentSourceId) {
// VOD stream
streamRequest = new google.ima.cast.dai.api.VODStreamRequest();
streamRequest.contentSourceId = imaRequestData.contentSourceId;
streamRequest.videoId = imaRequestData.videoId;
}
if (streamRequest && imaRequestData.ApiKey) {
streamRequest.ApiKey = imaRequestData.ApiKey;
}
if (streamRequest && imaRequestData.senderCanSkip) {
streamRequest.senderCanSkip = imaRequestData.senderCanSkip;
}
return streamRequest;
};
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, (request) => {
return streamManager.requestStream(request, getStreamRequest(request))
.then((request) => {
return Promise.resolve(request);
})
.catch((error) => {
this.broadcast('Stream request failed.');
return Promise.resolve(request);
});
});
castContext.start();
</script>
</body>
</html>
现在,您可以使用 Google 的 CAF DAI SDK 请求和播放 DAI 视频流。 如需详细了解高级 SDK 功能,请参阅 下载我们的示例接收器 应用。