amp-ima-video

简介

amp-ima-video 嵌入一个用于插播视频广告的视频播放器，该播放器与 IMA SDK 集成。

该插件提供一个带有内容控件的视频播放器，并使用 IMA SDK 从您选择的符合 VAST 标准的广告服务器请求和展示广告。

设置

导入 amp-ima-video 组件。

<script async custom-element="amp-ima-video" src="https://cdn.ampproject.org/v0/amp-ima-video-0.1.js"></script>

基本用法

amp-ima-video 组件 HTML 最多接受两种独特的 HTML 节点作为子节点 - 用于内容视频的 source 标签和用于字幕的 track 标签。这两种标签的使用方式与标准视频标签相同。

该组件需要一个在 data-tag 中提供的广告标签，该标签是指向符合 VAST 标准的广告响应的 URL（例如，请参见 IMA 示例标签）。它具有一个可选的 data-poster 属性，用于在播放前显示海报图像。

<amp-ima-video id="myVideo" width="640" height="360" layout="responsive" data-tag="https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=vmap&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ar%3Dpremidpost&cmsid=496&vid=short_onecue&correlator=" data-poster="/static/samples/img/ima-poster.jpg">
  <source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" type="video/mp4">
</amp-ima-video>

data-ad-label

在 data-ad-label 属性中提供格式字符串，以自定义在播放广告时显示的广告披露信息。这允许用户支持不同语言的广告披露。

格式字符串应类似于 "广告 (%s / %s)"。格式字符串中的 "%s" 分别替换为序列中的当前广告编号和广告总数（例如，广告 2 / 3）。如果未提供值，则默认为 "广告 (%s / %s)"。

<amp-ima-video id="myVideo2" width="640" height="360" layout="responsive" data-tag="https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=vmap&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ar%3Dpreonlybumper&cmsid=496&vid=short_onecue&correlator=" data-poster="/static/samples/img/ima-poster.jpg" data-ad-label="Publicidad (%s de %s)">
  <source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" type="video/mp4">
</amp-ima-video>

自动播放

使用 autoplay 属性自动播放视频，而无需用户按“播放”按钮。

（可选）使用 data-delay-ad-request="true" 将广告请求延迟到用户滚动页面或 3 秒钟之后（以先到者为准）。 amp-ima-video 组件的默认行为是在 AMP 页面加载时请求广告，即使没有展示，也会被计为“已投放的代码”。

<amp-ima-video id="myVideo3" width="640" height="360" layout="responsive" data-tag="https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=vmap&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ar%3Dpreonlybumper&cmsid=496&vid=short_onecue&correlator=" data-src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" data-delay-ad-request="true" autoplay>
</amp-ima-video>

需要进一步解释吗？

如果此页面上的解释没有涵盖您所有的问题，请随时与其他 AMP 用户联系，讨论您的确切用例。

转到 Stack Overflow

未解释的功能？

AMP 项目强烈鼓励您的参与和贡献！我们希望您成为我们开源社区的持续参与者，但也欢迎您为自己特别感兴趣的问题做出一次性贡献。

在 GitHub 上编辑示例

作者： @shawnbuso