我在使用Chrome浏览视频时遇到问题。
由于某种原因，无论我做什么，video.seekable.end(0)始终为0。
video.currentTime = 5依次叫，和时console.log(video.currentTime)，我看到它始终是0，这似乎重置了视频。
我已经尝试了基于MP4和VP9的webm格式，但是都给出了相同的结果。
更令人讨厌的是，Firefox可以完美地运行所有内容。我应该了解Chrome的一些特别之处吗？
这是我的代码（仅适用于Firefox）：
<div class="myvideo">
<video width="500" height="300" id="video1" preload="auto">
<source src="data/video1.webm" type="video/webm"/>
Your browser does not support videos.
</video>
</div>
这是javascript：
var videoDiv = $(".myvideo").children().get(0)
videoDiv.load();
videoDiv.addEventListener("loadeddata", function(){
console.log("loaded");
console.log(videoDiv.seekable.end(0)); //Why is this always 0 in Chrome, but not Firefox?
videoDiv.currentTime = 5;
console.log(videoDiv.currentTime); //Why is this also always 0 in Chrome, but not Firefox?
});
请注意，简单地调用videoDiv.play()实际上可以在两个浏览器中正确播放视频。
同样，在电影文件完全加载后，videoDiv.buffered.end(0)两个浏览器中的也会提供正确的值。
我花了一段时间才弄清楚...
问题出在服务器端。我使用的是Jetty版本来提供所有视频文件。Jetty的简单配置不支持字节服务。
Firefox和Chrome之间的区别在于，即使服务器不支持http代码206（部分内容），Firefox也会下载整个视频文件，以便您可以搜索整个视频文件。另一方面，Chrome拒绝下载整个文件（除非它很小，除非大约2-3mb）。
因此，currentTime要使html5视频的参数在Chrome中正常工作，您需要一台支持http代码206的服务器。
对于其他任何有此问题的人，您可以使用curl再次检查服务器配置：
curl -H Range:bytes=16- -I http://localhost:8080/GOPR0001.mp4
这应该返回代码206。如果返回代码200，则由于浏览器中的解决方法，Chrome将无法搜索视频，但Firefox将能够搜索视频。
最后一条提示：您可以使用npm http-server为支持部分内容的本地文件夹获取一个简单的http-server：
npm install http-server -g
并运行它以提供本地文件夹：
http-server -p 8000
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句