[英]how to play video after complete download in html5 video player?
// htm video tag
<video id="myVideo" width="320" height="176" preload="auto" controls>
<source src="/server/o//content/test2.mp4" onerror="alert('video not found')" type="video/mp4"> Your browser does not support HTML5 video.
</video>
// vuejs script
start() {
myVideo.onprogress = function(e) {
try {
var pro = myVideo.buffered.end(0) / e.srcElement.duration * 100
myVideo.play()
vprogress.value = Math.round(pro)
if (Math.round(e.srcElement.buffered.end(0)) / Math.round(e.srcElement.seekable.end(0)) === 1) {
alert('download complete')
alert(this.showvideo)
}
} catch (e) {
console.log(e)
}
}
}
},
mounted() {
this.start()
}
I want to download video on page load and after complete download it will play auto automatically onprogress event is called when i play the video but i want to call without playing the video . 我想在页面加载时下载视频,下载完成后它将自动播放,当我播放视频时会自动调用onprogress事件,但我想不播放视频就调用它。
You should try to check readyState property of video object. 您应该尝试检查视频对象的readyState属性。 Try something like this:
尝试这样的事情:
// htm video tag
<video id="myVideo" width="320" height="176" preload="auto" controls>
<source src="/server/o//content/test2.mp4" onerror="alert('video not found')" type="video/mp4"> Your browser does not support HTML5 video.
</video>
// vuejs script
start() {
myVideo.onprogress = function(e) {
try {
var pro = myVideo.buffered.end(0) / e.srcElement.duration * 100
myVideo.play()
vprogress.value = Math.round(pro)
if (Math.round(e.srcElement.buffered.end(0)) / Math.round(e.srcElement.seekable.end(0)) === 1) {
alert('download complete')
alert(this.showvideo)
}
} catch (e) {
console.log(e)
}
}
**strong text**}
},
ready() {
let video = document.getElementById("myVideo");
if ( video.readyState === 4 ) {
this.start()
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.