本文主要向您展示“如何利用HTML5实现在线视频播放”。 实现在线视频播放”这篇文章。
很多人将编码和格式误认为是同一件事，经常使用视频文件的后缀来唯一确定视频文件的支持级别。 其实可以用一句话来概括：视频的文件后缀（假设后缀没有被恶意更改）实际上代表的是一种封装格式，视频或音频的编码算法与文件没有直接关系封装格式本身：相同的封装格式（即相同的后缀）可以封装不同编码算法的视频和音频。 视频播放设备或软件是否支持视频播放不仅取决于封装格式，还取决于编码算法。 看清楚这一点，是认识问题、解决问题的基础。
打包格式规定了视频的所有内容，包括图像、声音、字幕、系统控制等，其中图像和声音最为关键。
从MPEG开始
MPEG 是定义视频大小的国际组织。 他们之前推出的MPEG-1和MPEG-2其实就是大家熟悉的VCD和DVD，但这些都是古老的东西了。 让我们看一下与本文主题相关的 MPEG-4 规范。
MPEG-4规范规定文件后缀为.mp4，目前包括三种图像编码和压缩算法：XvidDivXAVC（H.264），其中Xvid和DivX也可以统称为MPEG-4Part2或MPEG -4Visual，而比较著名的H.264和AVC是同一个概念。 对于音频，它是 AAC。 以下关于兼容性的内容来自维基百科和Format Shoe Factory以及作者的测试：
Android浏览器：支持DivX和AVC，Xvid应该不支持
iPhone 和 iPad (iOS)：支持 DivX 和 AVC，不支持 Xvid
Chrome：支持AVChtml5 video支持格式的视频，不支持DivX和Xvid。 微软于 2011 年初宣布，由于许可问题，将从 Chrome 浏览器中删除对 AVC (H.264) 的支持。 并且直到当前版本，仍然支持AVC。 另外，实际测试表明，如果DivX和AAC封装在mp4中，chrome可以播放，而且只有声音（AAC）。
Firefox和Opera：仍然因为许可问题，Firefox和Opera已经逐渐动摇了对AVC的支持。 笔者测试发现AVC在最新的Firefox中始终可以播放（维基百科的解释可能与系统本身带有解码器有关）； 至于DivX和Xvid，笔者在Firefox下的测试结果是不支持的。 从维基百科兼容性列表来看html5 video支持格式的视频，Opera 对 AVC 的支持不太好。
IE：笔者的IE11只能支持AVC，但不支持DivX和Xvid
WebM的倡导
因为AVC（H.264）的授权问题，以Chrome、Firefox、Opera为首的开源阵营开始动摇对AVC的支持，尽管这些浏览器仍然可以支持AVC，而且他们也倾向于开源名为WebM。 多媒体项目，其中包括一个名为 VP8 的新开源视频编解码器方案。 目前VP8已经发展到VP9。 WebM 作为一种封装格式，具有 .webm 后缀和 video/webm MIME 类型。 对于音频，可以使用 Vorbis/Opus。 从兼容性来看，Chrome、Firefox、Opera对VP8的兼容性非常好，但Safari和IE几乎无法支持。
开源 Ogg
Ogg几乎和WebM一样，开源，在开源平台上得到广泛支持。 其视频编码方案称为Theora（由VP3发展而来，由Xiph.org基金会开发，可用于任何封装格式），其音频为Vorbis。 后缀一般为.ogv或.ogg，MIME类型为video/ogg。 兼容性方面，目前只能支持Chrome、Firefox、Opera（不过Opera在联通平台上很难支持），Safari、IE几乎都很难支持。
Html5解决方案
上述讨论的实际前提是视频是基于Html5的解决方案。 现在我们总结一下兼容性：
*IE9“仅当用户安装了 VP8 编解码器时”才支持 VP8。
‡Google Chrome 浏览器于 2011 年宣布将放弃 H.264，但“尚未实现”。 可见目前主流仍然是MP4（AVC），而为了解决“开源阵营”对AVC的动摇，可以选择使用视频多源方案为webm提供额外支持或者ogg基于AVC：
浏览器会根据自己的喜好选择加载该格式的流媒体文件。 事实上，服务器必须提供对同一视频的多种格式的支持。 具体来说，你可以这样做：
提供WebM视频版本（VP8+Vorbis）
提供MP4视频版本（H.264+AAC（低复杂度））
提供Ogg版本（Theora+Vorbis）
服务器端建议使用nginx。 尽量注意MIME类型的正确配置。
旧版本的 IE 和 flash
在HTML5流行之前，常见的视频播放方案是flash和flv（flash从9开始支持h.264 mp4）。 而且随着ios设备的普及，Flash不再是万能的了。 越来越多的视频网站提供了多种解决方案，但他们更喜欢html5：即通过测量代理是否支持html5来确定是使用视频还是flash。 面对IE8以下的浏览器时，flash几乎是唯一的选择（silverlight一般不太被接受）。
事实上，flash和flv解决方案的实现方法有很多种。 笔者可以想到以下两种：
服务器根据代理类型输出不同的html。 如果支持html5，则输出video+mp4（avc）和webm（或ogg），否则输出flash相关的标签或脚本。
使用html5shiv和html5-video，IE也可以支持video标签，但是使用Flash播放器来代替原生视频播放。
将对象嵌入视频中：
以上就是《如何利用HTML5实现在线视频播放》一文的全部内容，感谢您的阅读！ 相信大家都有了一定的了解，希望分享的内容对大家有所帮助。 如果您想了解更多知识，请关注易速云行业资讯频道！
