Question

我的测试页面上有2个视频元素，如下所示：

<div id="parent">
    <video id="foo" autoplay>
        <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4" />
        <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.webm" type="video/webm" />
        <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.ogv" type="video/ogg" />
    </video>
    <video id="bar" autoplay>
        <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4" />
        <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.webm" type="video/webm" />
        <source src="http://www.quirksmode.org/html5/videos/big_buck_bunny.ogv" type="video/ogg" />
    </video>
</div>

在最新的FF中，一切正常。但是在Chrome中，这些视频都不会播放;查看网络标签显示，他们陷入“待定”状态，从几秒钟到无限远。如果我注释掉/删除视频元素，则另一个将播放。

我看过多个关于类似问题的Chromium bug报告，但似乎没有一个与父容器直接相关。我尝试通过JS动态构建标记，结果相同。我也试过添加编解码器属性而没有运气。

为了争论，我们可以说重组页面，这样就不能选择同一个父级中的视频。这只是一个无法修复的错误吗？任何可能的解决方法，但是hacky？

Answer 1

已解决 - 显然是在同一时间向同一台服务器发出相同文件名的请求。更改文件名或域可以正常工作。 FWIW，我复制了测试视频，并在文件名的末尾添加了1,2,3等，并从同一台服务器运行它们。按预期工作。使用来自不同领域的测试视频让我了解了解决方案。

Chrome - 没有播放多个视频 - 网络陷入待定状态

1 个答案: