私は、 GitHub https://github.comで見つけたプラグイン
のおかげで、YouTube ビデオの最新 ( 4.11.4 ) バージョンを使用して作業している Web サイトの YouTube ビデオでプレロール広告を使用しようとしています。 /eXon/videojs-youtube、AD 部分については、VAST 2.0 形式の xml を読み取るこのhttps://github.com/theonion/videojs-vast-pluginを使用しています。Revive Ad-Server によって提供されるものから提供します。 (v. 3.0) と mp4 ビデオを再生します。video.js.
videojs-youtube
videojs-vast-plugin
これは私が書いたコードです:
//= require video.dev
//= require youtube
//= require vast-client
//= require video.ads
//= require videojs.vast
<video id="video" class="video-js vjs-default-skin" controls preload="auto" width="610" height="343">
</video>
<script>
$(function(){
videojs('video', {plugins: {
ads: {},
vast: {
url: '{{url("ad-url")}}',
skip: 2
}
},
src: "http://www.youtube.com/watch?v={{youtubeCode}}",
techOrder: ["youtube", 'html5', 'flash']
})
});
</script>
このコードは部分的に機能します: YouTube ビデオのポスター画像を正常に表示し、カスタム ビデオ AD を再生し (構成に従って「2 秒でスキップ」アラートを使用)、必要に応じてビデオをスキップできますが、AD が終了するたびに (またはスキップされます) 次のエラーが表示されます。
Uncaught TypeError: Cannot read property 'vdata1423499421192' of null
Uncaught TypeError: Cannot read property 'handleSource' of null
いくつかの調査を行うことで、AD が停止した後に 2 番目のプレーヤーが「再初期化」されないことが問題である可能性があると思いますが、これを防ぐためにどこで行動すればよいかわかりません。dispose() メソッドを起動する前にタイムアウトを追加するように提案されたいくつかの回答を見つけましたが、それはプラグイン全体に散らばっており、実際に動作しているものを理解できません。「techOrder」の要素の順序を変更すると、特にフラッシュと html5 の場所を切り替えると、「vdata1423499421192」エラーは消えますが、それでもビデオは再生されません。
さらに、2 つの通常の mp4 ビデオ (mp4 広告付きの mp4 ビデオ) を再生すると、video.js と広大なプラグインの組み合わせで問題なく動作します。
編集: Githubで同様の問題を扱っているこのバグレポート を見つけまし