自动播放

桌面设备和移动网站设备均支持自动播放功能。

从 Chrome 53 和 iOS 10 开始，Android 和 iPhone 支持内嵌静音自动播放。

Safari 11（桌面版）已更改其处理自动播放的方式 视频。Google Chrome 也做出了类似的更改 于 2018 年 4 月推出

如果您的网站目前会自动播放视频，请更新 来处理这些新政策新的尝试自动播放代码 示例 演示如何尝试自动播放视频并回退到 点击播放。本指南将为您介绍这个新示例。

在浏览器中检测自动播放是否成功

目前，网络浏览器不提供用于检查自动播放功能是否已启用的简单查询， 是否支持。检查视频是否可以自动播放的唯一方法是

以下代码段演示了此方法：

var contentVideo = document.getElementById('myVideo');
var promise = contentVideo.play();

if (promise !== undefined) {
  promise.then(_ => {
    // Autoplay worked!
  }).catch(error => {
    // Autoplay failed.
  });
}

代码首先对返回play() Promise。在我们的示例中， Promise 用于检测自动播放功能，并设置 AdsRequest 。

自动播放和 IMA

IMA SDK AdsRequest 有两个与自动播放相关的字段，您需要 供应： setAdWillAutoPlay 和setAdWillPlayMuted。 前者可以确保广告服务器仅返回获得 自动播放（如果设为 true），而后者可确保广告服务器 只返回允许在静音或取消静音状态下开始播放的广告。 我们的示例使用 内容视频 作为指示浏览器是否 支持自动播放进行两项检查，了解三种可能的结果：

要进行这些检查，请尝试播放内容视频并查看返回的 Promise:

var adsInitialized, autoplayAllowed, autoplayRequiresMuted;

// Called on page load.
function init() {
  videoContent = document.getElementById('contentElement');
  playButton = document.getElementById('playButton');
  // Hide the play button unless we need click-to-play.
  playButton.style.display = 'none';
  // Add an event listener now in case we need to fall back to click-to-play.
  playButton.addEventListener('click', () => {
    adDisplayContainer.initialize();
    adsInitialized = true;
    videoContent.load();
    playAds();
  });
  // Create your AdsLoader and AdDisplayContainer here.
  setUpIMA();
  // Check if autoplay is supported.
  checkAutoplaySupport();
}

function checkAutoplaySupport() {
  var playPromise = videoContent.play();
  if (playPromise !== undefined) {
    playPromise.then(onAutoplayWithSoundSuccess).catch(onAutoplayWithSoundFail);
  }
}

function onAutoplayWithSoundSuccess() {
  // If we make it here, unmuted autoplay works.
  videoContent.pause();
  autoplayAllowed = true;
  autoplayRequiresMuted = false;
  autoplayChecksResolved();
}

function onAutoplayWithSoundFail() {
  // Unmuted autoplay failed. Now try muted autoplay.
  checkMutedAutoplaySupport();
}

function checkMutedAutoplaySupport() {
  videoContent.volume = 0;
  videoContent.muted = true;
  var playPromise = videoContent.play();
  if (playPromise !== undefined) {
    playPromise.then(onMutedAutoplaySuccess).catch(onMutedAutoplayFail);
  }
}

function onMutedAutoplaySuccess() {
  // If we make it here, muted autoplay works but unmuted autoplay does not.
  videoContent.pause();
  autoplayAllowed = true;
  autoplayRequiresMuted = true;
  autoplayChecksResolved();
}

function onMutedAutoplayFail() {
  // Both muted and unmuted autoplay failed. Fall back to click to play.
  videoContent.volume = 1;
  videoContent.muted = false;
  autoplayAllowed = false;
  autoplayRequiresMuted = false;
  autoplayChecksResolved();
}

function autoplayChecksResolved() {
  // Request video ads.
  var adsRequest = new google.ima.AdsRequest();
  adsRequest.adTagUrl = <YOUR_AD_TAG_URL>;

  ...

  adsRequest.setAdWillAutoPlay(autoplayAllowed);
  adsRequest.setAdWillPlayMuted(autoplayRequiresMuted);
  adsLoader.requestAds(adsRequest);
}

function onAdsManagerLoaded() {
  ...
  if (autoplayAllowed) {
    playAds();
  } else {
    playButton.style.display = 'block';
  }
}

function playAds() {
  try {
    if (!adsInitialized) {
      adDisplayContainer.initialize();
      adsInitialized = true;
    }
    adsManager.init(640, 360, google.ima.ViewMode.NORMAL);
    adsManager.start();
  } catch (adError) {
    videoContent.play();
  }
}

在 iPhone 上自动播放

除了之前的代码外，若要在 iPhone 上自动播放，你还需要 将 playsinline 参数添加到您的视频代码中。

index.html

<body>
  ...
  <video id="contentElement" playsinline muted>
    <source src="https://storage.googleapis.com/gvabox/media/samples/stock.mp4">
  </video>
</body>

对 HTML 所做的更改可确保您的内容在内嵌视频中播放 Android 版播放器，而不是 iPhone 的默认全屏播放器。

自动播放广告和音频广告

请务必考虑在以下情况下，广告请求是否会返回纯音频广告： 您的广告可能会静音自动播放如果有机会 我们建议您采用以下任一方法：

  • 将以下 VAST 网址参数 ad_type=video 更新为仅请求视频广告 广告（如果您的播放器支持视频）。如需详细了解网址参数 请参阅这份 Ad Manager 指南。
  • 移除静音开始播放的广告选项。

请参阅 IMA 音频广告指南 敬请期待