我试图在Chrome和Safari上为google ima sdk播放器找到在移动设备中自动播放广告的解决方案。我尝试了以下链接： -
所以我发现，如果你＆＃34;自动播放＆＃34;通过使用element.play（）而不是使用autoplay属性的视频，然后在ios和chrome上移动将暂停视频，而不是给你一个权限被拒绝的消息。这将触发暂停事件。确保您始终在移动设备上使用自动播放功能静音。
在Android上，请注意广告没有播放音频。代码中的某些内容是关闭音频然后再次尝试播放。
代码如下： -
<html>
<head>
<title>IMA HTML5 Simple Demo</title>
<!-- <link rel="stylesheet" type="text/css" href="style.css"> -->
<style>
#mainContainer {
position: relative;
width: 640px;
height: 360px;
}
#content, #adContainer {
position: absolute;
top: 0px;
left: 0px;
width: 640px;
height: 360px;
}
#contentElement {
width: 640px;
height: 360px;
overflow: hidden;
}
#playButton {
margin-top:10px;
vertical-align: top;
width: 350px;
height: 60px;
padding: 0;
font-size: 22px;
color: white;
text-align: center;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
background: #2c3e50;
border: 0;
border-bottom: 2px solid #22303f;
cursor: pointer;
-webkit-box-shadow: inset 0 -2px #22303f;
box-shadow: inset 0 -2px #22303f;
}
</style>
</head>
<body>
<div id="mainContainer">
<div id="content">
<video id="contentElement" muted>
<source src="http://rmcdn.2mdn.net/Demo/vast_inspector/android.mp4"></source>
<source src="http://rmcdn.2mdn.net/Demo/vast_inspector/android.webm"></source>
</video>
</div>
<div id="adContainer"></div>
</div>
<!-- <button id="playButton">Play</button> -->
<script type="text/javascript" src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
<!-- <script type="text/javascript" src="ads.js"></script> -->
<script>
// Copyright 2013 Google Inc. All Rights Reserved.
// You may study, modify, and use this example for any purpose.
// Note that this example is provided "as is", WITHOUT WARRANTY
// of any kind either expressed or implied.
var adsManager;
var adsLoader;
var adDisplayContainer;
var intervalTimer;
var playButton;
var videoContent;
function init() {
videoContent = document.getElementById('contentElement');
// playButton = document.getElementById('playButton');
// playButton.addEventListener('click', playAds);
setUpIMA();
}
function setUpIMA() {
// Create the ad display container.
createAdDisplayContainer();
// Create ads loader.
adsLoader = new google.ima.AdsLoader(adDisplayContainer);
// Listen and respond to ads loaded and error events.
adsLoader.addEventListener(
google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED,
onAdsManagerLoaded,
false);
adsLoader.addEventListener(
google.ima.AdErrorEvent.Type.AD_ERROR,
onAdError,
false);
// An event listener to tell the SDK that our content video
// is completed so the SDK can play any post-roll ads.
var contentEndedListener = function() {adsLoader.contentComplete();};
videoContent.onended = contentEndedListener;
// Request video ads.
var adsRequest = new google.ima.AdsRequest();
adsRequest.adTagUrl = 'https://pubads.g.doubleclick.net/gampad/ads?' +
'sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&' +
'impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&' +
'cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=';
// Specify the linear and nonlinear slot sizes. This helps the SDK to
// select the correct creative if multiple are returned.
adsRequest.linearAdSlotWidth = 640;
adsRequest.linearAdSlotHeight = 400;
adsRequest.nonLinearAdSlotWidth = 640;
adsRequest.nonLinearAdSlotHeight = 150;
adsRequest.setAdWillAutoPlay(true);
adsLoader.requestAds(adsRequest);
}
function createAdDisplayContainer() {
// We assume the adContainer is the DOM id of the element that will house
// the ads.
adDisplayContainer = new google.ima.AdDisplayContainer(
document.getElementById('adContainer'), videoContent);
}
function playAds() {
// Initialize the container. Must be done via a user action on mobile devices.
videoContent.load();
adDisplayContainer.initialize();
try {
// Initialize the ads manager. Ad rules playlist will start at this time.
adsManager.init(640, 360, google.ima.ViewMode.NORMAL);
// Call play to start showing the ad. Single video and overlay ads will
// start at this time; the call will be ignored for ad rules.
adsManager.start();
} catch (adError) {
// An error may be thrown if there was a problem with the VAST response.
adsManager.setVolume(0);
videoContent.play();
}
}
function onAdsManagerLoaded(adsManagerLoadedEvent) {
// Get the ads manager.
var adsRenderingSettings = new google.ima.AdsRenderingSettings();
adsRenderingSettings.restoreCustomPlaybackStateOnAdBreakComplete = true;
// videoContent should be set to the content video element.
adsManager = adsManagerLoadedEvent.getAdsManager(
videoContent, adsRenderingSettings);
// Add listeners to the required events.
adsManager.addEventListener(
google.ima.AdErrorEvent.Type.AD_ERROR,
onAdError);
adsManager.addEventListener(
google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED,
onContentPauseRequested);
adsManager.addEventListener(
google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED,
onContentResumeRequested);
adsManager.addEventListener(
google.ima.AdEvent.Type.ALL_ADS_COMPLETED,
onAdEvent);
// Listen to any additional events, if necessary.
adsManager.addEventListener(
google.ima.AdEvent.Type.LOADED,
onAdEvent);
adsManager.addEventListener(
google.ima.AdEvent.Type.STARTED,
onAdEvent);
adsManager.addEventListener(
google.ima.AdEvent.Type.COMPLETE,
onAdEvent);
playAds();
}
function onAdEvent(adEvent) {
// Retrieve the ad from the event. Some events (e.g. ALL_ADS_COMPLETED)
// don't have ad object associated.
var ad = adEvent.getAd();
switch (adEvent.type) {
case google.ima.AdEvent.Type.LOADED:
// This is the first event sent for an ad - it is possible to
// determine whether the ad is a video ad or an overlay.
if (!ad.isLinear()) {
// Position AdDisplayContainer correctly for overlay.
// Use ad.width and ad.height.
adsManager.setVolume(0);
videoContent.play();
}
break;
case google.ima.AdEvent.Type.STARTED:
// This event indicates the ad has started - the video player
// can adjust the UI, for example display a pause button and
// remaining time.
if (ad.isLinear()) {
// For a linear ad, a timer can be started to poll for
// the remaining time.
intervalTimer = setInterval(
function() {
var remainingTime = adsManager.getRemainingTime();
},
300); // every 300ms
}
break;
case google.ima.AdEvent.Type.COMPLETE:
// This event indicates the ad has finished - the video player
// can perform appropriate UI actions, such as removing the timer for
// remaining time detection.
if (ad.isLinear()) {
clearInterval(intervalTimer);
}
break;
}
}
function onAdError(adErrorEvent) {
// Handle the error logging.
console.log(adErrorEvent.getError());
adsManager.destroy();
}
function onContentPauseRequested() {
videoContent.pause();
// This function is where you should setup UI for showing ads (e.g.
// display ad timer countdown, disable seeking etc.)
// setupUIForAds();
}
function onContentResumeRequested() {
adsManager.setVolume(0);
videoContent.play();
// This function is where you should ensure that your UI is ready
// to play content. It is the responsibility of the Publisher to
// implement this function when necessary.
// setupUIForContent();
}
// Wire UI element references and UI event listeners.
init();
</script>
</body>
</html>
上面的代码不是在移动设备和移动设备中自动播放广告。 我在播放前使用adsManager.setVolume（0）静音视频广告。
但它不起作用。
任何帮助都将不胜感激。