Remove video with video byte 0, uncaught (in promise) domexception: failed to load because no supported source was f

Uncaught (in promise) DOMException: Failed to load because no supported source was found.

the above error occurs on the one hand, the number of bytes of the video obtained from the background is 0, is an empty video

was used to determine whether the video could be downloaded. In the project, there was a problem that the video from the mobile phone to the database could not be played at all for the 0 byte video. The console reported an error: Uncaught (in promise) DOMException: Failed to load because no supported source was found

solution:

determines the networkState of the video, if the value is equal to 3, it will not play, skip
- Media.networkState; //0. This element is not initialized 1. Normal but not using network 2. Downloading data 3. No resource

found

determines the resource length of the video. If it is NAN, it cannot be played. However, this may be limited by the network state, and it takes a certain amount of time to obtain the length of the video when the network is not good.
- Media.duration; // the current resource length stream returns an infinite

I use the item written by vue: ev.target is used to get the status of the video


videoChanging: function (ev) {
if (! $refs.video) {return}
// replace the SRC of video
if(this.videosrctwo){
var status = this.$refs. video-ended
if(status){
if(this.$refs. video-src == this.videosrcone){
this.$refs.video.src = this.videosrcTwo
console.log('ev.target.networkState', ev.target.networkState)
console.log('ev.target.duration', ev.target.duration)
this.$refs.video.play()
}else{
this.$refs.video.src = this.videosrcOne
}
}
if(ev.target.ended){
this.playing = false
// this.replay =true
}
} else {
this. IsLoop = true

}

if(ev.target.networkState == 3) return this.$refs.video-src = this.videosrcone
This result will not play '
ev.target.networkState 3
ev.target.duration NaN

Read More: