videoJS 在视频前点击按钮加载不同的广告 (xml)

问题描述

我正在设置一个快速演示，我需要展示两个广告，我加载了包含所有依赖项的 videoJs 播放器并链接到要单击的链接

<!-- Load dependent stylesheets. -->
<link rel="stylesheet" href="//googleads.github.io/videojs-ima/node_modules/video.js/dist/video-js.min.css" />
<link rel="stylesheet" href="//googleads.github.io/videojs-ima/node_modules/videojs-contrib-ads/dist/videojs.ads.css" />
<link rel="stylesheet" href="//googleads.github.io/videojs-ima/dist/videojs.ima.css" />

<video id="content_video" class="video-js vjs-default-skin"
       controls preload="auto" width="780" height="440">
    <source src="https://storage.googleapis.com/gvaBox/media/samples/android.mp4"
            type="video/mp4" />
</video>

<div onclick="Select(2)">ad 1</div>
<div onclick="Select(1)">ad 2</div>

<!-- Load dependent scripts -->
<script src="//googleads.github.io/videojs-ima/node_modules/video.js/dist/video.min.js"></script>
<script src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
<script src="//googleads.github.io/videojs-ima/node_modules/videojs-contrib-ads/dist/videojs.ads.min.js"></script>
<script src="//googleads.github.io/videojs-ima/dist/videojs.ima.js"></script>

我使用下面的JS

var player = videojs('content_video');

function Select(number) {

    if (number == 1) {

        var options = {
            id: 'content_video',adTagUrl: 'ad1.xml'
        };

        player.ima(options);

        player.load();

    }

    if (number == 2) {

        var options = {
            id: 'content_video',adTagUrl: 'ad2.xml'
        };

        player.ima(options);

        player.load();

    }

}

现在当页面加载它播放默认的android视频当我点击 ad1 时，播放器会重新加载并播放带有广告的播放器但是，当我点击第二个广告（不需要按该顺序）时，出现错误

Uncaught TypeError:player.ima is not a function

我知道我只能加载 player.ima 一次，那么在这种情况下我将如何更新选项并重新加载播放器，以便我可以在广告之间切换。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascript video.js