Firefox 无法识别视频 src 是否被中断

Question

我目前正在使用 video.js 以使视频观看更加可靠。当前的情况是：在观看视频时，连接中断（互联网连接中断）。

使用 chrome 没什么大不了的：我创建了一个函数，将函数附加到错误事件中，瞧，如果发生错误，我的函数能够恢复（在这种情况下，它只是试图重新加载视频并寻找到最后一个已知位置）。

在 Firefox 上什么也没发生。永远不会引发错误。 我试图解决这个问题并注意到Firefox似乎认为文件已完全加载以防网络中断。所以 bufferedPercent 跳到 1，loadedalldata 事件也被触发。对我来说，这似乎刚刚被打破，但我无法将其归结为 Firefox 或 video.js 问题。

还有其他人遇到此类问题或知道处理此类问题的更好方法吗？

背景信息：为了测试案例，我在两个运行 nginx 的网络服务器前面运行了一个 HAProxy，它们提供视频文件。为了触发我的问题，我只是杀死了当前正在传递流的 nginx。所以重新连接应该可以正常工作（只要另一个当然还在工作；）

感谢和问候， 黑暗人

Answer 1

可能是您将错误绑定在视频标签而不是源标签上吗？ 如here所述：

错误事件现在不是被分派给媒体元素本身，而是被传递给与导致错误的源相对应的子元素。

<video controls id="videoTag" width="640" height="360" preload="auto">
<source src="pathto.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' id="mp4Source">
<source src="pathto.webm" type='video/webm; codecs="vp8.0, vorbis"' id="webmSource">
</video>
<script type="text/javascript">
document.getElementById('mp4Source').addEventListener('error', function(ev) {
alert('mp4Source error');
}, false);
document.getElementById('webmSource').addEventListener('error', function(ev) {
alert('webmSource error');
}, false);
document.getElementById('videoTag').addEventListener('error', function(ev) {
alert('videoTag error');
}, false);
document.getElementById('videoTag').addEventListener('stalled', function(ev) {
alert('videoTag stalled');
}, false);

</script>

编辑：还检查停止事件，因为它在媒体资源下载时断开网络时触发。 Source.

在检测 HTML5 视频的播放/网络错误时，我通常使用 section 末尾代码后面的内容。 谢谢