Question

首先，我想问一下这个问题。没有任何其他视频内容我无法加载元数据。 preload = "metadata"无效。我在Win Chrome上测试，不知道它在Safari / FF / IE / Opera上是如何工作的。因此，我无法快速加载六个或更多视频剪辑。 Chrome可能会在类似的端口/协议/域中仅保留六个已打开的连接。如果我加载的视频超过六个，则前六个视频完全加载时，最后一个视频无法启动加载。

jsfiddle需要吗？我可以创造，但我认为没有必要。例如。 HTML：10 html5 <video>，每个约100mb，preload=metadata属性。 JS（使用jQuery只是为了清晰）：

$('video').on('loadedmetadata',function(){
  console.log(this.duration);
}).each(function(i){
  this.load();
});

然后在Chrome开发者工具中打开“网络”标签并重新加载页面。六个视频将开始加载并将加载完整内容，而其他四个视频将等待(pending)标记。首先，在控制台中会出现6条消息。完全加载任何第一个视频后，系统会显示新消息。

我尝试了很多东西，但每个人都跌倒了。现在我关于在服务器端获取元数据。有没有关于PHP的解决方案？但JS解决方案会更好。

我也知道使用Youtube的解决方案，可能是Vimeo和其他一些网站。这是在一些子域名（s1.youtube.com，s2.youtube.com等）上保留视频。但我不能用它。我制作网站模板，它有一些要求。

我有很多视频的视频库。玩家必须在第一次视频播放前显示持续时间并知道宽度/高度。另外，我想从视频中间拍摄视频海报。任何停止视频加载和关闭连接的解决方案都是我需要的。它解决了确实获取元数据的麻烦。

Answer 1

如果您想在Chrome中加载6个以上的视频，则需要使用.webm格式。

注意：如果您的视频代码中包含大量资源，请执行以下操作：

<video width="320" height="240" controls autoplay> <source src="vid.webm" type="video/webm"> <source src="vid.mp4" type="video/mp4"> </video>

我认为Chrome默认为mp4而不是webm。你必须做一些jquery魔术才能让它运转起来。 Advice on that can be seen here.

Answer 2

v42的情况现在会变得更糟（目前是测试版 - 所以希望能够修复）

它现在尊重preload='metadata'但是没有将连接释放回池中，因此在加载6个视频后它就会完全卡住！

请参阅错误报告：https://code.google.com/p/chromium/issues/detail?id=468930

仅加载来自html5视频/音频的元数据

2 个答案: