我的测试页上有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中,这些视频都无法播放。查看“ net”选项卡可以发现他们陷入了“待定”状态,持续了几秒钟到无穷远。如果我注释掉/删除了一个视频元素,另一个将播放。

我已经看到多个Chromium错误报告,它们都在谈论类似的问题,但是似乎都没有与父容器直接相关的报告。我试过通过JS动态创建标记,结果相同。我也尝试过添加编解码器属性,但是没有运气。

为了争辩,可以说重组页面,以使没有视频可以在同一父级中进行。这是一个无法修复的错误吗?有任何可行的解决方法,但是很麻烦?

最佳答案

解决了-显然是在同一时间从同一台服务器请求相同文件名的请求使Google感到惊讶。更改文件名或域可以正常工作。 FWIW,我复制了测试视频,并在文件名的末尾添加了1、2、3等,然后从同一服务器运行它们。可以正常工作。使用来自不同领域的测试视频使我着手解决方案。

10-05 20:30
查看更多