正如您可以看到此处的示例https://github.com/theonion/videojs-vast-plugin,the播放器在主视频之前播放视频广告。但是，当我将广告客户提供的网址放在我自己的HTML网页中时，没有广告，我必须点击播放按钮然后主视频将开始。这是代码。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Video.js VAST Example</title>
<!--<link href="http://vjs.zencdn.net/4.7.1/video-js.css" rel="stylesheet">-->
<link rel="stylesheet" href="css/video-js.css">
<link rel="stylesheet" href="videojs.vast.css">
<link href="lib/videojs-contrib-ads/videojs.ads.css" rel="stylesheet" type="text/css">
<link href="videojs.vast.css" rel="stylesheet" type="text/css">
<script src="https://pv.sohu.com/cityjson?ie=utf-8"></script>
<style>
.example-video-container {
position: absolute;
top: 30px;
left: 50%;
margin-left: -315px;
}
#vid2 {
position: absolute;
top: 30px;
}
</style>
<!--[if lt IE 9]><script src="lib/es5.js"></script><![endif]-->
<!--<script src="http://vjs.zencdn.net/4.7.1/video.js"></script>-->
<script src="js/video.js"></script>
<script src="lib/videojs-contrib-ads/videojs.ads.js"></script>
<script src="lib/vast-client.js"></script>
<script src="videojs.vast.js"></script>
</head>
<body>
<div class="example-video-container">
<video id="vid2" class="video-js vjs-default-skin" autoplay controls preload="auto"
poster=""
data-setup='{}'
width='710'
height='500'
>
<source src="v1.mp4" type='video/mp4'>
<!--<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg'>-->
<p>Video Playback Not Supported</p>
</video>
</div>
<script type="text/javascript">
console.log(returnCitySN["cip"]+','+returnCitySN["cname"]);
videojs('vid2',{}, function () {
var timestamp=Math.round(new Date().getTime()/1000);
console.log(timestamp);
var player = this;
player.ads();
player.vast({
url:'https://p.algovid.com/vpvast?p=99974938&cb=' + timestamp + '&d=https%3A%2F%2Fh5.xcloudgame.com&w=710&h=500'
});
player.on('readyforpreroll',function(){
player.ads.startLinearAdMode();
console.log('adsstart');
player.one('ended', function() {
player.ads.endLinearAdMode();
console.log('adsend');
});
});
});
</script>
</body>
</html>
xml文件将返回此内容。
<VAST version="2.0">
<Ad id="VPAID">
<InLine>
<AdSystem version="1.0">Cedato</AdSystem>
<AdTitle>Cedato VPAID Ad Manager</AdTitle>
<Impression />
<Creatives>
<Creative sequence="1">
<Linear>
<Duration>00:00:30</Duration>
<MediaFiles>
<MediaFile delivery="progressive" width="710" height="500" scalable="1" type="application/x-shockwave-flash" apiFramework="VPAID">https://c.algovid.com/player/cedato_vpw_ima_101.82.swf?vp=378&p=99974938&sid=&w=710&h=500&h=500&w=710&pv=102.83&d=https%3A%2F%2Fh5%2Excloudgame%2Ecom</MediaFile>
<MediaFile delivery="progressive" width="710" height="500" scalable="1" type="application/javascript" apiFramework="VPAID">https://c.algovid.com/player/cedato_vpaid_102.83.js?p=99974938&sid=&w=710&h=500&h=500&w=710&pv=102.83&d=https%3A%2F%2Fh5%2Excloudgame%2Ecom</MediaFile>
</MediaFiles>
</Linear>
</Creative>
</Creatives>
</InLine>
</Ad>
</VAST>
有没有人能告诉我如何解决这个问题？
答案 0 :(得分：1)
Afaig，videojs-vast-plugin无法播放VPAID。
例如，您需要videojs-vast-vpaid插件。
不幸的是我无法播放资源，原因是：
AD ERROR: VAST Error: on VPAIDAdUnitWrapper.waitForEvent, timeout while waiting for event 'AdLoaded'
但这可能是由广告服务器配置引起的（也可能不接受我的推荐人），所以你需要自己找出来。
你会在github上找到videojs-vast-vpaid插件的例子，但这就是我所做的：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Video.js VAST Example</title>
<!-- VideoJs required styles-->
<link rel="stylesheet" type="text/css" href="//mailonline.github.io/videojs-vast-vpaid/demo/videojs_4/video-js.css"/>
<!-- VideoJs.vast.vpaid required styles-->
<link rel="stylesheet" type="text/css" href="//mailonline.github.io/videojs-vast-vpaid/styles/videojs.vast.vpaid.css"/>
<!-- DEMO required styles-->
<link rel="stylesheet" type="text/css" href="//mailonline.github.io/videojs-vast-vpaid/demo/styles/demo.css"/>
<!-- Web Fonts -->
<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
<script type="text/javascript">
// this is mandatory for IE8 !!!!!
document.createElement('video');
document.createElement('audio');
document.createElement('track');
</script>
<!-- VideoJs required scripts-->
<script type="text/javascript" src="//mailonline.github.io/videojs-vast-vpaid/demo/videojs_4/video.js"></script>
<!-- VideoJs.vast.vpaid required scripts-->
<script type="text/javascript" src="//mailonline.github.io/videojs-vast-vpaid/scripts/es5-shim.js"></script>
<script type="text/javascript" src="//mailonline.github.io/videojs-vast-vpaid/scripts/ie8fix.js"></script>
<script type="text/javascript" src="//mailonline.github.io/videojs-vast-vpaid/scripts/videojs_4.vast.vpaid.js"></script>
<script src="https://pv.sohu.com/cityjson?ie=utf-8"></script>
</head>
<body>
<div class="example-video-container">
<video id="vid2" class="video-js vjs-default-skin" autoplay controls preload="auto" poster="" data-setup='{}' width='710' height='500'>
<source src="oceans.mp4" type='video/mp4'>
<p>Video Playback Not Supported</p>
</video>
</div>
<script type="text/javascript">
console.log(returnCitySN["cip"]+','+returnCitySN["cname"]);
var timestamp = Math.round(new Date().getTime()/1000);
var vjs = videojs('vid2',{}, function () {
var player = this;
var vastPlugin = player.vastClient({
adTagUrl: '//p.algovid.com/vpvast?p=99974938&cb=' + timestamp + '&d=https%3A%2F%2Fh5.xcloudgame.com&w=710&h=500',
//adTagUrl: '//rtr.innovid.com/r1.5554946ab01d97.36996823;cb=%25%CACHEBUSTER%25%25',
playAdAlways: true,
adCancelTimeout: 60000,
vpaidFlashLoaderPath: './VPAIDFlash.swf'
});
player.on('reset', function () {
console.log('vast-plugin enabled - ' + vastPlugin.isEnabled() ? 'true' : 'false')
if (!vastPlugin.isEnabled()) {
vastPlugin.enable();
} else {
vastAd.disable();
}
});
});
</script>
</body>
</html>
可用于测试的资源：http://rtr.innovid.com/r1.5554946ab01d97.36996823;cb=%25%CACHEBUSTER%25%25
配置可能不完美 - 我对这个播放器比较熟悉。
希望这在某种程度上有所帮助并度过美好的一天。
答案 1 :(得分：-1)
不幸的是我目前无法运行测试，但根据您对问题的描述，可能需要更新此参数d=https%3A%2F%2Fh5.xcloudgame.com？