HTML5 Video with AutoPlay block source folder from being renamed

心不动则不痛 提交于 2020-01-06 03:08:24

问题


I have encountered a strange issue. I have a webpage where users can upload a video and the video plays on a HTML5 video (using "autoplay" in the tag) on a small screen after the upload is completed. Also, after the upload, the user can click a button to save what they have uploaded, whereby the folder containing the video is renamed. However, if they click save button too quickly, IIS gives an error that the folder is unavailable (for renaming). But if they wait about 20 seconds into the video playing, it renames the folder okay. Also, if the video is not on "autoplay", it works okay.

Initially, I though the video must be buffering, so I wrote some javascript to reveal the events in the console and, no, it is not buffering...it's just playing and giving timeupdates (which is normal). To demonstrate, here is an image of the event output of both scenarios, i.e., with/without "autoplay".

I would like to figure out what the HTML5 video is doing to block the folder from being renamed so that the user can save the uploaded video (and rename the folder) immediately, without having to wait...or, at least, provide a message to the user to wait for a particular amount of time before clicking the button to save it. Any help is appreciated.

Edit: I have tried to pause the video and remove the source, like this...

vid.pause();
vid.src = '';

...when the user clicks the save button, but it didn't work.


回答1:


I found the answer...and it was tricky. When I showed all of the video events being executed in the console, I found that IE and Chrome report the "networkStatus" property and the "suspend" event differently. To be specific:

  • IE: does not report "onsuspend" events when the video loads up and starts playing on autoplay. You can only know that the folder of the source file is freed by checking the "networkStatus" property (must equal 1). So, we want: networkStatus==1 (and number of "suspend"s will be zero).
  • Chrome: reports networkStatus == 1 on events before the folder of the source is freed...don't trust it. You must check for a count of how many "onsuspend" events have occurred (must be greater than 1) or count of how many "seekable" events have occurred (at least one of these). So, we want: number of "suspend"s greater than one (regardless of networkStatus, which should already be one).

So, in summary, here is the logic I used to detect when the folder of the source video file was freed:

var countofsuspends = 0;
vid.onsuspend = function() {countofsuspends += 1;}
if ((vid.networkState == 1)&&((countofsuspends != 1)||(countofseeks > 0))) {} //...do something here...

The first part of the "&&" above is to address the IE issue. The second part is to address the Chrome issue.

Hope this helps someone else out there.



来源:https://stackoverflow.com/questions/51786361/html5-video-with-autoplay-block-source-folder-from-being-renamed

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!