Question

尝试使用Vast 2.0和video.js开发自定义视频播放器。我通过跳过按钮功能显示了前贴片广告。

我将自定义视频显示为广告。

有人可以帮助我如何在一段时间后显示多个中期滚动？

更新XML文件以供参考：

<VAST xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="2.0" xsi:noNamespaceSchemaLocation="vast.xsd">

    <Ad id="176" >

        <InLine>
            <AdSystem version="2.0">ONION</AdSystem>
            <AdTitle>In-Stream Video</AdTitle>
            <Description>Grand Budapest Hotel_Fridays</Description>

            <Impression><![CDATA[http://reporting.theonion.com/videoadtracker/track.gif?videoAd=176&event=impression]]></Impression>
            <Creatives>
                <Creative sequence="1" AdID="">
                    <Linear>
                        <Duration>00:00:10</Duration>
                        <TrackingEvents>
                            <Tracking event="start"><![CDATA[http://reporting.theonion.com/videoadtracker/track.gif?videoAd=176&event=start]]></Tracking>

                            <Tracking event="start"><![CDATA[http://ad.doubleclick.net/ddm/trackimp/N2998.Onion/B7912634.16;dc_trk_aid=279982600;dc_trk_cid=57339121;ord=[timestamp]]]></Tracking>





                        </TrackingEvents>

                        <VideoClicks>
                            <ClickThrough><![CDATA[http://ad.doubleclick.net/ddm/trackclk/N2998.Onion/B7912634.16;dc_trk_aid=279982600;dc_trk_cid=57339121;ord=[timestamp]?http://www.foxsearchlight.com/thegrandbudapesthotel]]></ClickThrough>
                        </VideoClicks>

                        <MediaFiles>

                            <MediaFile id="1" delivery="progressive" type="video/mp4"><![CDATA[media/test.mp4]]></MediaFile>

                            <MediaFile id="1" delivery="progressive" type="video/webm"><![CDATA[http://v.theonion.com/onionmedia/videos/videometa/1521/test.webm]]></MediaFile>

                        </MediaFiles>
                    </Linear>
                </Creative>
            </Creatives>
      </InLine>

    </Ad>

</VAST>

Answer 1

应播放VAST广告时的信息不是VAST-XML的一部分，而是播放器实施和配置的一部分。客户应该能够决定何时播放广告。

只需找到视频的中间位置或为流定义固定的时间并开始播放广告。由于你已经有了这个玩家，这应该是一件容易的事。

Answer 2

使用video.js，您可以通过检查currentTime值，使用timeupdate事件在特定时间触发您想要的任何内容。

尝试使用以下代码段并查看其控制台，在第5阶段，您可以触发展示操作的广告等。

var player = videojs('my-video');
player.on('timeupdate', function(){
  var currentTime = this.currentTime();
  console.log(currentTime)
  if(Math.round(currentTime)===5){
    console.info('Trigger your code here');
  }
});

<link href="https://vjs.zencdn.net/6.6.3/video-js.css" rel="stylesheet"/>
<script src="https://vjs.zencdn.net/6.6.3/video.js"></script>


<video id="my-video" class="video-js" controls preload="auto" width="640" height="264"
  poster="https://vjs.zencdn.net/v/oceans.png" data-setup="{}">
    <source src="https://vjs.zencdn.net/v/oceans.mp4" type='video/mp4'>
    <p class="vjs-no-js">
      To view this video please enable JavaScript, and consider upgrading to a web browser that
      <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
  </video>

使用插件在视频播放器中显示插播广告

2 个答案: