我有一个1080p视频，我正在HTML5中显示 <video> 在我的页面上标记。
是否有一种简单的（ish）javascript方法来检测带宽，因此如果用户的连接速度太慢而无法流式传输，我可以将视频切换为质量较低的版本？与YouTube的“自动”视频尺寸选择器背后的逻辑类似。
我有一个1080p视频，我正在HTML5中显示 <video> 在我的页面上标记。
是否有一种简单的（ish）javascript方法来检测带宽，因此如果用户的连接速度太慢而无法流式传输，我可以将视频切换为质量较低的版本？与YouTube的“自动”视频尺寸选择器背后的逻辑类似。
在谷歌浏览器中，至少视频元素上有以下属性：
webkitVideoDecodedByteCount: 0
webkitAudioDecodedByteCount: 0
这些应足以确定客户端解码视频的速度。在视频播放时，您将跟踪这些字节的增量，这将为您提供客户端处理视频的字节/秒。
根据您使用的播放器和编码平台，您可以对视频使用HLS编码。 HLS代表HTTP Live Streaming，这是Apple开发的一种主要用于解决此问题的协议（以及其他）。
HLS基本上将您的视频文件分成多个小文件，因此可以使用简单的Web服务器对其进行“伪”流式处理。使用HLS，您还可以以多种分辨率进行编码，并且播放器可能能够切换到更低或更高的带宽。
唯一的缺点是大多数玩家使用Flash来播放HLS编码的内容。在这里查看它： http://www.flashls.org/latest/examples/chromeless/
这是流媒体的HLS演示： http://demos.flowplayer.org/basics/hls.html
这是VideoJS的一个插件： https://github.com/videojs/videojs-contrib-hls
要在HLS中进行编码，您可以免费使用ffmpeg并将文件上传到服务器： https://www.ffmpeg.org/ffmpeg-formats.html#hls-1
或者，您可以使用基于云的解决方案，如AWS Transcoder或Brightcove https://aws.amazon.com/elastictranscoder/
有关更新的答案：MPEG-DASH正在替换HLS。 HLS主要用于iOS领域。大多数桌面浏览器不打算支持它，而DASH是他们正在迈向的标准。 （但是，有很多播放器旨在让您使用HLS与hls.js等HTML5视频播放器）。 DASH播放器包括Bitmovin，Google Shaka等。许多人目前都编码HLS和DASH。 HLS还支持碎片mp4。请注意，您需要在服务器端正确编码视频。附加资源： http://www.streamingmedia.com/Articles/Articles/Editorial/Featured-Articles/The-State-of-MPEG-DASH-2016-110099.aspx
我讨厌那个功能！这通常是错误的，如果我想等待2个小时来加载我的视频，那就等我了！如果没有向用户发送大型虚拟文件并测量到达他的时间，就没有可靠的方法来准确地测量它。
您应该依靠用户输入（并且正确记住它！也与YouTube不同！）。
简而言之， 不要以YouTube为例。
有付费服务可以让您指示对方所在的带宽，例如 NETSPEED。
数据准确性可能足够你，但我没有机会为自己测试它。
到目前为止，您必须在MPEG-DASH和HLS中提供您的内容，以便为所有平台提供广泛的支持。 HLS现在支持分段MP4，您可以使用 一种单一输出格式，在每个设备上播放。此外，你需要 存储量减少50％并且由于fMP4比目前用于HLS的MPEG-TS更具存储效率，因此可以节省更多存储和带宽。
比特莫文提供了一个 例 如何创建HLS fMP4内容以及如何播放它。