此页面由 Cloud Translation API 翻译。

广告规则

IMA HTML5 SDK 支持完全自动化的广告播放列表。此功能按照 Google Ad Manager 。它还大大简化了视频播放器代码（包括前贴片广告、中贴片广告和后贴片广告）。

创建 AdsManager 时，一个 contentPlayback 对象通过 getAdsManager 传入的调用。此对象必须具有可返回当前进度条指针的 currentTime 属性视频的具体位置。如果您使用 HTML5 video 元素展示您的内容，只需将该元素传递给 SDK。此对象用于跟踪内容播放的进度在 Ad Manager 中指定的时间自动插入。您还需要让 SDK 知道您希望它代表您处理内容状态。
```
var adsRenderingSettings = new google.ima.AdsRenderingSettings();
adsRenderingSettings.restoreCustomPlaybackStateOnAdBreakComplete = true;
adsManager = adsManagerLoadedEvent.getAdsManager(
    videoContent, adsRenderingSettings); // See API reference for
    
    contentPlayback.
```

为了确保后贴片广告可以播放，您需要告知 SDK 您的内容何时已完成。这有点棘手，因为在某些情况下，SDK 会使用您的视频因此您需要确保仅在而不是在广告播完之后才展示为此，您可以使用代码如下：

var videoContent = document.getElementById('contentElement');
var contentEndedListener = function() {adsLoader.contentComplete();};

videoContent.addEventListener('ended', contentEndedListener);

function onContentPauseRequested() {
  contentElement.removeEventListener('ended', contentEndedListener);
  ...
}

function onContentResumeRequested() {
  contentElement.addEventListener('ended', contentEndedListener);
  ...
}

CONTENT_PAUSE_REQUESTED 和CONTENT_RESUME_REQUESTED 事件用于在广告插播时间点播放时暂停和恢复内容。
如果您的视频播放器支持拖动搜索，并且当前时间属性为视频播放器会在用户拖动时更新，因此 SDK 无法区分内容播放之间的时间间隔。您必须使用自定义 contentPlayback 对象作为 getAdsManager 的参数。有关这种使用情形的示例，请参阅寻找问题。

注意：当内容播放完毕或如果用户已停止播放，请务必调用 AdsLoader.contentComplete ，以便向 SDK 表明内容已完成。然后，SDK 会播放后贴片广告插播时间点（如果已安排）。ALL_ADS_COMPLETED 事件。此外，请注意内容跟踪会在调用 init() 时开始，您应始终在播放内容前调用 init()。

停用广告插播时间点自动播放功能

在某些情况下，您可能需要阻止 SDK 播放广告插播时间点，你就为他们做好了准备在这种情况下，您可以停用以便告知 SDK 您已准备好播放广告插播时间点。这个配置之后，SDK 加载广告插播时间点后，就会触发一个 AD_BREAK_READY 事件。当播放器准备好开始播放广告插播时间点时您可以调用 adsManager.start()：

function requestAds() {}
  ...
  adsLoader.getSettings().setAutoPlayAdBreaks(false);
  ...
}

function onAdsManagerLoaded() {
  ...
  // For non-auto ad breaks, listen for ad break ready
  adsManager.addEventListener(
      google.ima.AdEvent.Type.AD_BREAK_READY,
      adBreakReadyHandler);
  ...
}

function adBreakReadyHandler() {
  // Once we're ready to play ads. To skip this ad break, simply return
  // from this handler without calling adsManager.start().
  adsManager.start();
}

试试看

您可在下方看到有效的实现代码。

跳转时遇到的问题

如果您使用广告规则，则可能会遇到点击并拖动跳转方面的问题。具体而言，在用户点击并拖动以浏览多个视频之后中贴片广告连播，他们可能也会看到 2 个或多个连播广告继续播放内容。这是由于在用户正在寻找视频如果 SDK 恰好轮询当前时间，而用户系统可能会认为应该播放此广告。当内容接着播放该广告，接着播放自跳转后的最新广告。对于请见下图：

解决此问题的简单方法是在用户启动并在 SDK 请求时报告该时间，直到用户恢复正常播放。如需此解决方案的直观表示，请参阅如下图所示：

使用此解决方案，您可以跳过 0:10 的中贴片广告，仅播放 0:20 的中贴片广告。这是使用自定义进度条指针跟踪器完成的，如下所示。以下代码包含高级 HTML5 中对 ads.js 的修改（以粗体显示）我们的下载页面。

var Ads = function(application, videoPlayer) {
  ...
  this.currentTime = 0;
  setInterval(this.updateCurrentTime, 1000);
};

Ads.prototype.updateCurrentTime = function() {
  if (!this.videoPlayer_.contentPlayer.seeking) {
    this.currentTime = this.videoPlayer_.contentPlayer.currentTime;
  }
};

Ads.prototype.onAdsManagerLoaded_ = function(adsManagerLoadedEvent) {
  this.application_.log('Ads loaded.');
  this.adsManager_ = adsManagerLoadedEvent.getAdsManager(this);
  this.processAdsManager_(this.adsManager_);
};

移动版 Safari 的已知问题

此方法适用于除移动版 Safari 之外的所有平台。在移动设备上 Safari 中，视频代码的跳转属性未正确实施（始终返回 false）。要解决该问题，您需要自行检查查看用户是否正在跳转至视频。此方法的示例代码。同样，下面的粗体代码行是对现有代码的修改。

var Ads = function(application, videoPlayer) {
  ...
  this.currentTime = 0;
  setInterval(this.updateCurrentTime, 1000);
  this.seeking = false;
  this.seekCheckInterval = 1000;
  // You may need to adjust this value, depending on your platform
  this.seekThreshold = 100;
  this.previousTime = 0;
  setInterval(
      Application.bind(this, this.checkForSeeking),
      this.seekCheckInterval);
};

Ads.prototype.updateCurrentTime = function() {
  if (!this.seeking) {
    this.currentTime = this.videoPlayer_.contentPlayer.currentTime;
  }
};

Ads.prototype.checkForSeeking = function() {
  var currentTime = this.videoPlayer_.contentPlayer.currentTime;
  // How much time has passed since you last ran this method, in milliseconds
  var diff = (currentTime - this.previousTime) * 1000;
  // If that difference is greater than the time since you last ran this method,
  // plus the threshold, the user was seeking
  if (Math.abs(diff)  > this.interval + this.threshold) {
    this.seeking = true;
  } else {
    this.seeking = false;
  }
  // Grab the current video time again to make up for time spent in this method
  previousTime = this.videoPlayer_.contentPlayer.currentTime;
};

Ads.prototype.onAdsManagerLoaded_ = function(adsManagerLoadedEvent) {
  this.application_.log('Ads loaded.');
  this.adsManager_ = adsManagerLoadedEvent.getAdsManager(this);
  this.processAdsManager_(this.adsManager_);
};

完成这些更改后，SDK 现在会使用 Ads 的 currentTime 属性对象（而不是currentTime 内容视频播放器。