'AbortError: The operation was aborted.' - Error when adjusting HTML 5 video.currentTime in Firefox
'AbortError: The operation was aborted.' - Error when adjusting HTML 5 video.currentTime in Firefox
使用 Firefox 并使用 HTML5 视频更改视频位置时。有谁知道是什么原因造成的?
这是我的想法:
- 将其设置为没有相应帧的时间值 - 我试图始终将其设置为存在帧的时间以应对此问题
- 请求下一帧时视频帧没有加载 - 为了测试这一点,我将超时设置为 5 毫秒,这肯定会减少错误数量,因此这是一些证据错误的来源。
我制作了调整视频时间的滑块,重现了错误:
var vid = $('#v0')[0];
var slider = document.getElementById('vidSlider')
linkVideoToSlider();
vid.onplay = vid.onclick = function() {
vid.onplay = vid.onclick = null;
setTimeout(function() {
vid.pause();
slider.value = vid.currentTime / vid.duration * 100
vid.currentTime += (1 / 29.97);
}, 12000);
setInterval(function() {
$('#time').html((vid.currentTime * 29.97).toPrecision(5));
slider.value = vid.currentTime / vid.duration * slider.max;
}, 100);
};
function linkVideoToSlider() {
var adjustVideoTime = function() {
//Note that we attempt to adjust to a time that has a frame.
setTimeout(function() {
vid.currentTime = Number.parseFloat(slider.value / 29.97).toFixed(4);
}, 5);
}
slider.oninput = adjustVideoTime
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Frame number:
<p id="time"></p>
<video id="v0" controls tabindex="0" autobuffer preload>
<source type="video/webm; codecs="vp8, vorbis"" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.webm"></source>
<source type="video/ogg; codecs="theora, vorbis"" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.ogv"></source>
<source type="video/mp4; codecs="avc1.42E01E, mp4a.40.2"" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.mp4"></source>
<p>Sorry, your browser does not support the <video> element.</p>
</video>
<div class="slidecontainer">
<p>Time of video slider:</p>
<input type="range" min="0" max="1024" value="0" class="slider" id="vidSlider">
</div>
如果您更喜欢 JSFiddle:
https://jsfiddle.net/tehsurfer/9ahz5rmd/52/
这是 Firefox 中的 reported bug,已在 70+ 版本中修复。
AbortError: The operation was aborted
在以下任一情况下输出到控制台:
- 视频元素中的搜索已中止。
- 调整视频元素的时间。
那里的一些开发人员表示,在这些情况下,Firefox 的性能比 Chrome 或 Edge 慢得多,但我还没有找到一种方法来亲自验证差异。
如果发现错误修复或解决方法,我将更新此答案。
更新:
将 Firefox 更新到 70 后,它似乎已修复,性能似乎有所提高。
使用 Firefox 并使用 HTML5 视频更改视频位置时。有谁知道是什么原因造成的?
这是我的想法:
- 将其设置为没有相应帧的时间值 - 我试图始终将其设置为存在帧的时间以应对此问题
- 请求下一帧时视频帧没有加载 - 为了测试这一点,我将超时设置为 5 毫秒,这肯定会减少错误数量,因此这是一些证据错误的来源。
我制作了调整视频时间的滑块,重现了错误:
var vid = $('#v0')[0];
var slider = document.getElementById('vidSlider')
linkVideoToSlider();
vid.onplay = vid.onclick = function() {
vid.onplay = vid.onclick = null;
setTimeout(function() {
vid.pause();
slider.value = vid.currentTime / vid.duration * 100
vid.currentTime += (1 / 29.97);
}, 12000);
setInterval(function() {
$('#time').html((vid.currentTime * 29.97).toPrecision(5));
slider.value = vid.currentTime / vid.duration * slider.max;
}, 100);
};
function linkVideoToSlider() {
var adjustVideoTime = function() {
//Note that we attempt to adjust to a time that has a frame.
setTimeout(function() {
vid.currentTime = Number.parseFloat(slider.value / 29.97).toFixed(4);
}, 5);
}
slider.oninput = adjustVideoTime
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Frame number:
<p id="time"></p>
<video id="v0" controls tabindex="0" autobuffer preload>
<source type="video/webm; codecs="vp8, vorbis"" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.webm"></source>
<source type="video/ogg; codecs="theora, vorbis"" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.ogv"></source>
<source type="video/mp4; codecs="avc1.42E01E, mp4a.40.2"" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.mp4"></source>
<p>Sorry, your browser does not support the <video> element.</p>
</video>
<div class="slidecontainer">
<p>Time of video slider:</p>
<input type="range" min="0" max="1024" value="0" class="slider" id="vidSlider">
</div>
如果您更喜欢 JSFiddle: https://jsfiddle.net/tehsurfer/9ahz5rmd/52/
这是 Firefox 中的 reported bug,已在 70+ 版本中修复。
AbortError: The operation was aborted
在以下任一情况下输出到控制台:
- 视频元素中的搜索已中止。
- 调整视频元素的时间。
那里的一些开发人员表示,在这些情况下,Firefox 的性能比 Chrome 或 Edge 慢得多,但我还没有找到一种方法来亲自验证差异。
如果发现错误修复或解决方法,我将更新此答案。
更新:
将 Firefox 更新到 70 后,它似乎已修复,性能似乎有所提高。