在微信端使用video標簽,播放結束會出現QQ瀏覽器推薦視頻的解決辦法(vue)
阿新 • • 發佈:2017-11-12
優酷 tar var top tel auto 應該 qq瀏覽器 每隔一秒
會出現播放結束顯示QQ瀏覽器推薦視頻的原因:(我是vue的項目,而且我是新手,只是單純的給大家分享一個方法,代碼比較low請自動忽略)
因為在x5(QQ瀏覽器)內核中,把video標簽劫持了,只要是檢測到使用了video標簽的話(包括使用了基於h5的video寫的插件),就會出現這種情況。
解決辦法:
html部分:(需要的是一個id選擇器,其他的請忽略,src中的內容是調接口返回)
<video autoplay id="end" controls :src="chapter.url" poster="http://eres.xgstars.com/promote/ed.png"></video>
js部分:
showOtherVideo(){ let _this = this; setTimeout(function(){ var dom = document.getElementById(‘end‘); var flag = dom.paused; if(!flag){ _this.showOtherVideo(); }else{ // _this.showOtherVideo(); if(dom.currentTime == dom.duration && dom.currentTime!=0){ //這裏的判斷是如果視頻的總時間等於視頻已經播放的時間,並且視頻的播放時間不為零時 //這個地方的就是寫視頻結束的時候的代碼的地方 }else{ _this.showOtherVideo(); } } },1000) }, 這個的原理就是通過一個計時器每隔一秒刷新一次,來監聽視頻是不是播放完畢,如果沒有播放完畢則繼續監聽,如果播放完畢就執行下面的方法,可以調用你自己公司的接口來請求下一段視頻,替換當前視頻,他會有一秒的閃爍,然後就會跳走,如果先看看效果的話,就去微信瀏覽器裏面看看優酷,他們就是這種效果,但是方法應該不會這麽low。在微信端使用video標簽,播放結束會出現QQ瀏覽器推薦視頻的解決辦法(vue)