IT技术 - HTML5 视频未流式传输且需要 90 秒才能加载 - 吾爱随笔录

IT技术 javascript html video webpage

2021-02-10 13:13:05

我有一个 HTML5 视频播放器：

<video width="800" height="475" id ="video" controls="" src="" autoplay></video>

这似乎在开发中 100% 工作，但在生产视频中可能需要长达 90 秒才能加载。我想弄清楚 html5 播放器是否真的是流媒体播放器，还是需要先完整下载？一位同事告诉我，我设置了这样的标签：

<video width="800" height="475" id ="video" controls="" src="" preload="none" autoplay></video>

将 preload 选项设置为 none 或 metadata 应该强制浏览器流式传输视频而不是缓冲整个内容。我在这里有哪些选择？我应该放弃 html5 播放器吗？我的印象是 html5 播放器是在我们的 Intranet 上播放视频流的正确方式。有什么建议？

1个回答

因为您必须通过公共互联网而不是本地网络移动文件，所以您需要使用 ffmpeg 之类的东西将元数据（MOOV atom）移动到视频文件的前面，以便它可以更快地开始流式传输

./ffmpeg -y -i SourceFile.mp4 -s 1280x720 -c:v libx264 -b 3M -strict -2 -movflags faststart DestFile.mp4

以上将为您提供 1280x720 的输出，在 mp4 容器中使用 h264 以 3Mbps 的速度，然后将执行第二遍将 moov 元素移动到文件的前面，使其能够更快地开始流式传输（有关更多详细信息，请参阅此答案）。

您还应该检查您的生产服务器配置是否与您的开发服务器匹配，特别是支持字节范围请求的能力，允许更优化的内容流

其它你可能感兴趣的问题