Processing
 

HTML5 video element request stay pending forever (on chrome)

21/04/2013 23:39#1

Joined at: 12 months ago

Post: 10

Thank: 0

Thanked: 0

I have a weird issue in Chrome.

Each time I load a <video> element, chrome will start two HTTP request.

The first one will stay pending forever (I guess this is the "meta-data", "partial content" request. But the point is that it stay pending)

The second one to the same file is ok and goes on and close after the loading is over.

The problem here is that the first request stay pending until I close the browser page. So at some point, if I load multiple video, Chrome will break and stop downloading anything because every available request is occupied by these pending requests.

I created a reduced test case here: http://jsbin.com/ixifiq/3


I've check to reproduce the issue, and it is happening on both Video.js and MediaElements.js frontpages. Open your network tab when loading the page, you'll see the first pending request. Then press play on the video, and you'll see the second request working, but the first one will stay pending forever.

Does anyone knows a fix to this bug?

23/05/2013 13:36Top#2

Joined at: 12 months ago

Post: 10

Thank: 0

Thanked: 0

Apparently that's a bug from Chrome. And there's nothing to do about it ATM.

I reported the issue a while ago on the Chromium project and it's been assigned. So hopefully it'll be fixed in near future.

Bug report: https://code.google.com/p/chromium/issues/detail?id=234779

05/11/2014 15:34Top#3

Ronan

Member

Joined at: 12 months ago

Post: 9

Thank: 0

Thanked: 0

(This bug still exists in Chrome 38.0.2125.111, OS X 10.10)

This may be a Chrome bug & you may solve it without any dummy ?time-suffix trick, just helping Chrome releasing sockets faster:

I had the same bug on a RevealJs HTML presentation, with 20+ videos (one per slide, autoplayed on slide focus). As a side effect, this unreleased socket problem also affected other ajax-lazy-loaded medias following immediately the first pending/blocked video, in the same HTML DOM.

Following Walter's answer (see bug report), I fixed the issue following the next steps:

1- Set video preload attribute to none:

<video preload="none">     <source src="video.webM" type="video/webM"> </video> 

2 - Use a canplaythrough event handler to play and/or pause the video once it is loaded & ready. This helps Chrome releasing the socket used to load that video :

function loadVideos(){     $("video").each(function(index){             $(this).get(0).load();             $(this).get(0).addEventListener("canplaythrough", function(){                 this.play();                 this.pause();             });     }); } 
17/09/2013 19:14Top#4

Unapedra

Member

Joined at: 9 months ago

Post: 1

Thank: 0

Thanked: 0

I don't know if it will be functional right now, but I remember solving this issue by adding a parameter to the video URL, just like "video.mp4?t=2123". Of course, everytime you load the video, the parameter should be different. I'd use

var parameter = new Date().getMilliseconds();  

to get it, and add it.

With this, at least a few months ago, I was able to play the same video multiple times without Chrome waiting forever the response.

Hope it helps.

09/06/2015 09:48Top#5

Joined at: 12 months ago

Post: 6

Thank: 0

Thanked: 0

I found this issue when using html5 video inside dynamic content such as carousels, to release the blocked sockets you have to unload the video source:

var video = $('#video'); video[0].pause(); video.prop('src',''); video.find('source').remove(); video.remove(); 

The bug claims to be fixed but I still had to do this on Chrome 42. At least I could still set preload="auto".

19/04/2015 21:05Top#6

Ecropolis

Member

Joined at: 9 months ago

Post: 1

Thank: 0

Thanked: 0

This bug still exists. I'm using an HTML5 video player on a single page application. After loading about 7 players with pre-buffering, I hit the limit and no more videos load. I found another answer having to do with images and I was surprised to find that this answer solves this problem.

if(window.stop !== undefined) {     window.stop(); } else if(document.execCommand !== undefined) {     document.execCommand("Stop", false); } 

reference: Javascript: Cancel/Stop Image Requests

30/06/2016 19:14Top#7

Seth

Member

Joined at: 12 months ago

Post: 55

Thank: 0

Thanked: 0

We had the same symptoms, but the problem was that we were calling load() on the same video twice in succession: same video control, same video source (MP4). Two identical 206 requests showed up in the dev tools, and then, after switching video a few times, Chrome would cancel the first request, turn off progressive playback, and wait for that second request to complete.

Also note that if you're using an MP4 source and it isn't formatted for progressive playback (meaning the MOOV atom is at the beginning of the file), then you will have 1-2 additional requests for the file, which makes it even more confusing.

Similar articles

Chrome, THREE.js: Cross-origin image load denied

5 years ago - Reply: 5 - Views: 271

Prevent Google Chrome Log XMLHttpRequest

3 years ago - Reply: 5 - Views: 277

How can I include ChromeDriver in a JAR?

3 years ago - Reply: 3 - Views: 83

Chrome geolocation not working on any site

3 years ago - Reply: 1 - Views: 49

wrong borders' width in android browser

3 years ago - Reply: 4 - Views: 207

Uncaught SyntaxError: Unexpected token < On Chrome

3 years ago - Reply: 10 - Views: 472

Flashdata not getting cleared in Codeigniter

4 years ago - Reply: 5 - Views: 58

Illegal access Javascript error in Chrome

3 years ago - Reply: 1 - Views: 53

ng-repeat not updating in Chrome

3 years ago - Reply: 1 - Views: 82

Applying border to a checkbox in Chrome

4 years ago - Reply: 2 - Views: 119

open browser plugin using access vba

3 years ago - Reply: 1 - Views: 26

vé máy bay vé máy bay giá rẻ ve may bay ve may bay gia re vé máy bay vé máy bay giá rẻ ve may bay ve may bay gia re vé máy bay vé máy bay giá rẻ ve may bay ve may bay gia re vé máy bay vé máy bay giá rẻ ve may bay ve may bay gia re vé máy bay vé máy bay giá rẻ ve may bay ve may bay gia re vé máy bay vé máy bay giá rẻ ve may bay ve may bay gia re vé máy bay vé máy bay giá rẻ ve may bay ve may bay gia re