Chrome 无法在重复的标签上播放 html5 视频

Chrome not play html5 video on duplicated tags

本文关键字：标签 播放 html5 视频 Chrome      更新时间：2023-09-26

在我的页面上，我有两个视频标签来自同一个视频源。例：

<video id="video_description_html5_api" class="vjs-tech" poster="poster.jpg" preload="metadata">
<source src="video.mp4.ogv" type="video/ogg">
<source src="video.mp4.mp4" type="video/mp4">
<source src="video.mp4.webm" type="video/webm">
</video>
<video id="video_preview" class="vjs-tech" poster="poster.jpg" preload="metadata">
<source src="video.mp4.ogv" type="video/ogg">
<source src="video.mp4.mp4" type="video/mp4">
<source src="video.mp4.webm" type="video/webm">
</video>

当我开始在谷歌浏览器中播放这些视频之一，然后尝试播放第二个 - 最后一个未加载的视频时。此错误/功能仅在 Chrome 中。火狐浏览器可以同时正确播放两个视频。

知道我如何强制播放第二个视频吗？

（评论者@Hamza库巴想出了答案，原始海报报告为他们解决了问题，但它在评论中。在此处复制/粘贴作为答案，它所属的位置。

。尝试将 ？1 添加到视频 URL： <source src="video.mp4.ogv?1" type="video/ogg"> <source src="video.mp4.mp4?1" type="video/mp4"> <source src="video.mp4.webm?1" type="video/webm"> 缺点是视频必须加载两次，所以这并不理想......顺便说一句，我假设 chrome 存在一个错误，使其无法在同一页面上播放同一源两次。我没有注意到你的代码有任何问题。

。请记住，Chrome 将使用此方法将视频文件加载两次到内存中，并从服务器加载两次。但是，在Chrome修复此错误之前，我不确定是否有好的选择。

相关文章：