播放前减少 html5 视频缓冲区

Question

当有人点击观看我网站上的视频（Html5 视频标签中的 mp4）时，浏览器会在显示之前缓冲大量视频。这不是必需的 - 视频不到半分钟长，并且在整个视频下载时只显示了一半。

有没有办法告诉浏览器不要缓冲那么多？

Answer 1

如果您最关心的是让视频更快地播放，您可以使用 preload 属性更快地开始缓冲。

<video controls preload="auto">
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Answer 2

Is there a way to tell browsers not to buffer so much?

缓冲过程最初完全由客户端控制 ^*（请参阅下面关于如何以编程方式控制的更新）我们只能使用preload 属性。

使用 preload = "auto"（或只是一个空白字符串）向浏览器表明视频可能会完整播放：

即便如此，如果客户端认为有必要，也可以覆盖它。 source

更新

*) 有来有往 Media Source Extension (thanks @Tim McClure) which do allow programmatic control of buffering. The support varies - source:

Windows8 (MP4) 上版本 11 的 Internet Explorer。（2013 年 10 月）
Google Chrome 自 2013 年初以来，也在 Android（MP4、WEBM）上。
Safari 8 在 OS X（MP4、TS）上。

它可以在 Firefox 中的标志 (about:config) 下启用。

有关如何使用它的更多详细信息，请参阅此 longer four part series（来自 Tim McClure 的评论）。

Specification details

Answer 3

评论中有很多关于是否可以这样做的讨论，所以我将在此处提供特定于媒体源的答案。

Media Source Extensions 或 MSE 是一组新的（尚未得到广泛支持的）工具，可帮助您使用 [=46= 控制缓冲和流式传输] 视频。来自 W3C 摘要：

This specification extends HTMLMediaElement to allow JavaScript to generate media streams for playback. Allowing JavaScript to generate streams facilitates a variety of use cases like adaptive streaming and time shifting live streams.

我会特别向您推荐 SourceBuffer Object，其中包含有关如何处理音频和视频轨道缓冲的信息。

对 MSE 的支持因浏览器和格式而异 (source)：

Chrome 桌面 34+（MP4、WEBM）
Chrome 对于 Android 34+（MP4、WEBM）
IE 11+ 在 Windows 8.1 (MP4)
IE Windows Phone 8.1+ (MP4)
Mac 的 Safari（MP4、TS）

用户可以在 about:config 中打开对 Firefox 的支持 (source). Support has been in the works for some time.

为了有效地利用这一点，还需要实施更多的工作，包括视频文件聚类。我建议阅读这篇 4-part series，它逐步介绍了如何利用上述所有内容创建功能齐全的 HTML5 视频播放器。

播放前减少 html5 视频缓冲区

Make an html5 video buffer less before playing

html

javascript

asp.net

video