Javascript计算流的视频字节范围答案

【问题标题】：Javascript calculate video byte range for streamingJavascript计算流的视频字节范围
【发布时间】：2021-06-14 07:38:04
【问题描述】：

我正在关注这个教程https://web.dev/fast-playback-with-preload/

我正在尝试计算如何计算请求范围，即示例给出 { headers: { range: 'bytes=567140-1196488' }

这些范围从何而来？我需要知道确切的视频文件大小才能计算吗？

谢谢

【问题讨论】：

标签： javascript html5-video streaming

【解决方案1】：

只有当服务器支持范围请求时，服务器才会返回这些范围。查看here了解更多详情。

【讨论】：

【解决方案2】：

我使用 Headers 请求来获取文件大小并计算范围

【讨论】：

【解决方案3】：

以防万一您查看的来源不清楚 - 您实际上不必自己执行此操作，尽管您可能希望将其作为学术练习。

如果您在网页中使用标准 HTML5 视频标签，而不使用 Video.js 等第三方 HMTML 视频播放器，或者使用您链接到的示例中的媒体源扩展实现您自己的 javascript 播放器，那么浏览器将负责检查服务器是否支持范围请求并为您处理请求。您需要做的就是提供 URL 并将视频托管在支持范围请求的服务器上。

如果您确实使用了像 video.js 这样的 3rd 方播放器，那么它会再次为您解决这个问题，您不必担心范围。实际上，许多（大多数？）玩家无论如何都会将范围请求交给底层浏览器。

值得补充的是，现在大多数重要的流媒体服务都使用自适应比特率流媒体 - 使用 ABR 创建视频的多个比特率版本，每个版本都被分解成相等长度（按时间）的块 - 例如10 秒块。然后，播放器能够从最适合当前网络条件的比特率流中选择下一个块。更多信息请看这里：https://stackoverflow.com/a/42365034/334402

【讨论】：

感谢我使用它手动预加载多个视频