video.buffered.length 到底说明了什么？

Question

我注意到当一个html5视频正在加载（缓冲）时，它的

buffered.length

值为2，当它完成加载时，它会变成1。

这是了解视频是否已存储在缓存中的可靠方法吗（

buffered.length == 1

）？如果没有，我是不是错过了什么？有人能准确解释一下这个值告诉我什么吗？

Answer 1

根据 Apple HTMLMediaElement 文档

buffered

是 TimeRanges

这就是为什么 length 属性似乎是错误的

可以使用

计算缓冲百分比

video.buffered.end(0) / video.duration

Answer 2

据我了解，

buffered

返回一个

TimeRanges

对象，其中包含有关已缓冲多少视频或音频的数据。

buffered

具有三个属性：

length

、

start

和

end

。

length

返回正在缓冲的媒体“部分”的数量。

显然，正常情况下，

buffered.length

返回1。

Opera 对此是这么说的：

正常情况下，只会有一个范围——浏览器启动 从时间0开始下载，下载范围扩展到然而 目前有很多可用的。然而，如果用户向前查找， 浏览器可以停止当前下载并启动新的请求 视频的后半部分。在这种情况下，将有两个范围 缓冲数据。

*来源（向下滚动或搜索buffered）

我的猜测是，这不是判断视频是否被缓存的可靠方法。

Answer 3

完整的代码行，其中#是一个整数：

document.getElementById("videoId").buffered.start(#);

document.getElementById("videoId").buffered.end(#);

document.getElementById("videoId").buffered.length;

如果缓存了某些内容，不应该立即加载吗？因此

video.buffered.end(0)

一旦缓存的视频开始就会自动结束视频？

有人可以随时纠正我或确认这一点。

注意：

end()

需要一个参数。此参数返回定义的缓冲 vid 的值。例如。如果开始播放 60 秒的视频，则

start(0)

为 0，并且

end(0)

逐渐变大。如果将视频的位置更改为 30 秒，

start(1)

会变为 30 秒，并且

end(1)

从 30 秒逐渐变大。

不幸的是，我发现 iOS 10.2.1 上的移动 Safari 似乎总是返回 1 的值

.length

。因此，我怀疑跨浏览器的支持不一致。这在 Firefox 51.0.1 中变得更糟（它应该对这些方法有更好的支持），它将

.length

增加 1，然后不久又再次减少。我怀疑这“可能”是由 Firefox 将视频的两个缓冲部分组合在一起引起的。 由于上述原因，我会尝试寻找另一种方法来确定如何检测视频是否被缓存。

尝试输入 Chrome 和 Firefox 的 URL：

about:cache

Answer 4

对于某些网站，video.buffered与浏览器缓存一一对应，但对于某些网站，浏览器视频缓存已被清除，对应的video.buffered并没有改变。

我测试了这两个网站：

1. 完整播放视频
2. 确认 video.buffered.start(0)==0, video.buffered.end(0)==video.duration
3. 断开网络并拖动视频进度条

结果： 第一个网站的视频可以完整播放，但第二个网站的视频无法完整播放