我在Chrome中有一个奇怪的问题。
每次加载< video>元素,chrome将启动两个HTTP请求。
第一个将永远保持不变(我猜这是“元数据”,“部分内容”请求,但关键是它保持挂起)
这里的问题是,第一个请求保持挂起,直到我关闭浏览器页面。因此,在某些时候,如果我加载了多个视频,Chrome会中断并停止下载任何内容,因为每个可用请求都被这些待处理请求占用。
我在这里创建了一个简化的测试用例:http://jsbin.com/ixifiq/3
我检查重现的问题,它发生在Video.js和MediaElements.js前台。加载网页时打开网络标签,您会看到第一个待处理请求。然后按视频上的播放,您将看到第二个请求工作,但第一个请求将永远保持不变。
有谁知道这个bug的修复?
解决方法
(这个错误仍然存在于Chrome 38.0.2125.111,OS X 10.10)
这可能是Chrome的错误&你可以解决它没有任何虚拟的时间后缀的伎俩,只是帮助Chrome释放套接字更快:
我在RevealJs HTML演示文稿上有相同的错误,有20个视频(每个幻灯片一个,在幻灯片焦点上自动播放)。作为副作用,此未释放的套接字问题也影响在同一HTML DOM中紧接着第一个待处理/已阻止视频之后的其他ajax延迟加载媒体。
按照Walter的答案(见bug report),我解决了下面的步骤后的问题:
<video preload="none"> <source src="video.webM" type="video/webM"> </video>
2 – 使用canplaythrough事件处理程序在视频加载完毕后播放和/或暂停视频。准备。这有助于Chrome释放用于加载该视频的套接字:
function loadVideos(){ $("video").each(function(index){ $(this).get(0).load(); $(this).get(0).addEventListener("canplaythrough",function(){ this.play(); this.pause(); }); }); }