©
Ce document utilise Manuel du site Web PHP chinois Libérer
<audio> 和 <video> 元素为不带插件播放音频和视频提供支持。媒体文件的格式由包含一个或多个数据流的容器组成, 它使用称为编码解码器的压缩格式进行编码。容器的文件扩展名是可识别的。容器中的流有多种类型, 其中可以包括视频、音频、数据或字幕。单个容器 (即媒体文件) 可以容纳同一类型的多个流。在音频和视频流中是编解码器。编码解码器, 简称为 "编码解码器", 是一种用于压缩文件中的数据的算法。每个容器类型只有它所支持的特定的编解码器。
理解为什么 web 需要不同的媒体格式是很重要的。由于各种原因, 主要超出了本文的范围, 不同的浏览器支持不同的媒体格式。此外, 网络上的媒体格式在许多国家, 包括美国和欧盟国家, 都受到专利法的严重影响。(本文中关于专利的说明是按目前的情况提供的, 没有任何保证。本文讨论与 web 最相关的格式, 包括在移动和桌面上的浏览器中的支持。
显示媒体
下面简要回顾了如何在 HTML 中引用媒体元素。有关详细信息, 请参阅每个元素的文章。
HTML5 支持多个媒体元素。<video> 和 <audio> 元素可单独使用, 也可以与 <source> 元素合并。一个简短的例子说明。虽然 <video> 和 <audio> 元素都包含 src 属性, 但此示例使用 <source> 元素以多种格式提供视频文件, 从而允许每个浏览器选择它支持的元素。
<video controls> <source src="somevideo.webm" type="video/webm"> <source src="somevideo.mp4" type="video/mp4"> I'm sorry; your browser doesn't support HTML5 video in WebM with VP8/VP9 or MP4 with H.264.</video>
文件格式
下面列出的是 HTML 媒体元素支持的文件格式的数字 (尽管不是全部)。要了解哪些浏览器支持哪些格式, 请参阅本页底部的浏览器兼容性部分。
WebM
WebM 格式基于 Matroska 容器格式的受限版本。它总是使用 VP8 或 VP9 视频编解码器和 Vorbis 或天音编解码器。
WebM格式,特别是VP8视频编解码器,被指控的专利侵权由一组公司回答的一个电话由mpegla为形成一个专利水池,但mpegla同意授予那些专利对Google在"永久, 可转让, 免版税许可证 "。这意味着, WebM 格式的所有已知专利都是免费许可的。
Gecko将下列MIME类型识别为WebM文件：
视频/webmA WebM 媒体文件, 包含视频 (也可能是音频). 音频/webmA WebM 媒体文件只包含音频。
Ogg Theora Vorbis
Ogg容器格式使用Theora视频编解码器和 Vorbis音频编解码器。在的桌面和移动端的Gecko(Firefox)，Chrome和Opera；Safari（非IOS）可以通过添加扩展支持；但是不支持Internet Explorer
WebM在可选的情况下是优选项；因为它能提供更高的压缩比，并且被更多的浏览器所支持；而Ogg容器格式主要用于支持低版本的浏览器（比如： Firefox 3.5/3.6就不支持WebM，但是支持Ogg）
Ogg的授权情况和WebM类似
Gecko提供下面3种Ogg文件格式的MIME type：
audio/ogg
一个只包含音频的Ogg文件
video/ogg
一个包含视频或音频的Ogg文件
application/ogg
一个不指定内容的Ogg文件，当你不知道内容的时候可以选择
Ogg Opus
Ogg容器可以通过使用Opus codec包含音频编解码器；用来支持Gecko 15.0 (Firefox 15.0 / Thunderbird 15.0 / SeaMonkey 2.12) 或更新的版本
Ogg FLAC
Ogg容器可以通过使用FLAC codec包含音频编解码器；用来支持Gecko 51.0 (Firefox 51.0 / Thunderbird 51.0 / SeaMonkey 2.48) 或更新的版本, 但只适用于桌面浏览器
MP4 H.264 (AAC or MP3)
MP4 的容器格式与 H. 264 视频编解码器和 AAC 音频编解码器是本地支持的桌面/移动互联网浏览器, Safari 和 Chrome, 但铬和歌剧不支持的格式。IE 和 Chrome 也支持 MP4 容器中的 MP3 音频编解码器, 但是 Safari 没有。火狐/火狐操作系统在某些情况下支持这种格式, 但只有当第三方解码器可用时, 设备硬件才能处理用于编码 MP4 的配置文件。
高端编码的MP4不能在低端手机等低端硬件上运行。
MPEG 媒体格式被专利所覆盖, 而这些都不是免费许可的。一些必要的许可证可以从 MPEG 购买。因为 H. 264 当前不是皇族自由格式, 它不适合开放网络平台, 根据 Mozilla [1, 2], Google [1, 2] 并且歌剧。然而, 由于没有版税的格式是不支持的互联网浏览器和 Safari, Mozilla 决定支持的格式无论如何, 和谷歌从来没有兑现他们的承诺, 以消除对它的支持, 在 Chrome。
MP4 FLAC
从Firefox 51开始，你就可以使用FLAC编解码器播放MP4了，不管你有没有安装 MediaSource Extensions和DRM 扩展支持。
MP3
MP3 audio 编码对应浏览器<audio>的支持。其中Firefox/Firefox for Android/Firefox OS需要操作系统本身提供了MP3的解码器；而IE，Chrome，Safari则原生支持
WAVE PCM
WAVE容器使用PCM音频编解码器；桌面和移动Gecko (Firefox) a、 Safari都支持，WAVE容器中的文件后缀为 ".wav"。
请参阅WAVE编解码器注册表的RFC 2361。
Gecko提供下面4种WAVE文件格式的MIME type：
audio/wave（首选;在Chrome中不起作用）
audio/wav
audio/x-wav
audio/x-pn-wav
FLAC
FLAC容器格式使用 FLAC 音频编解码器 (FLAC codec)；桌面端受到Gecko Firefox 51.0 (Firefox 51.0 / Thunderbird 51.0 / SeaMonkey 2.48)的支持，文件后缀为 “.flac”
Gecko提供下面几种FLAC文件格式的MIME type：
audio/flac（优选）
audio/x-flac
浏览器兼容性
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
Basic support | 3.0 | 3.5 (1.9.1) | 9.0 | 10.50 | 3.1 |
<audio>: PCM in WAVE | (Yes) | 3.5 (1.9.1) | No support | 10.50 | 3.1 |
<audio>: Vorbis in WebM | (Yes) | 4.0 (2.0) | No support | 10.60 | 3.11 |
<audio>: Streaming Vorbis/Opus in WebM via MSE | ? | 36.0 (36.0)2 | ? | ? | ? |
<audio>: Vorbis in Ogg | (Yes) | 3.5 (1.9.1) | No support | 10.50 | No support |
<audio>: MP3 | (Yes)4 | (Yes)5 | 9.0 | (Yes) | 3.1 |
<audio>: MP3 in MP4 | ? | ? | ? | ? | (Yes) |
<audio>: AAC in MP4 | (Yes)6 | (Yes)7 | 9.0 | (Yes) | 3.1 |
<audio>: Opus in Ogg | 27.0 | 15.0 (15.0) | ? | ? | ? |
<audio>: FLAC | 56.0 | 51 (51) | No support | No support | No support |
<audio>: FLAC in Ogg | 56.0 | 51 (51) | No support | No support | No support |
<video>: VP8 and Vorbis in WebM | 6.0 | 4.0 (2.0) | 9.08 | 10.60 | 3.19 |
<video>: VP9 and Opus in WebM | 29.0 | 28.0 (28.0)36 | ? | (Yes) | ? |
<video>: Streaming WebM via MSE | ? | 42.0 (42.0)35 | ? | ? | ? |
<video>: Theora and Vorbis in Ogg | (Yes) | 3.5 (1.9.1) | No support | 10.50 | No support |
<video>: H.264 and MP3 in MP4 | (Yes)3 | (Yes)10 | 9.0 | (Yes) | (Yes) |
<video>: H.264 and AAC in MP4 | (Yes)4 | (Yes)11 | 9.0 | (Yes) | 3.1 |
<video>: FLAC in MP4 | ? | 51 (51) | ? | ? | ? |
any other format | No support | No support | No support | No support | 3.112 |
Feature | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Mobile | Opera Mobile | Opera Mini | Safari Mobile |
|---|---|---|---|---|---|---|---|---|
Basic support | (Yes) | 29 | 24.0 | 1.0.1 | 10.0 | 11.0 | (Yes)13 | 3.2 |
<audio>: PCM in WAVE | ? | ? | 24.0 | 1.0.1 | No support | No support | (Yes)14 | 3.2 |
<audio>: Vorbis in WebM | ? | ? | 24.0 | 1.0.1 | No support | 11.0 | (Yes)15 | No support |
<audio>: Streaming Vorbis in WebM via MSE | ? | ? | ? | ? | ? | ? | ? | ? |
<audio>: Vorbis in Ogg | ? | ? | 24.0 | 1.0.1 | No support | 11.0 | (Yes)16 | No support |
<audio>: MP3 | ? | ? | (Yes)17 | (Yes)18 | 10.0 | ? | (Yes)19 | 3.2 |
<audio>: MP3 in MP4 | ? | ? | ? | ? | ? | ? | ? | (Yes) |
<audio>: AAC in MP4 | ? | ? | (Yes)20 | (Yes)21 | 10.0 | ? | (Yes)22 | (Yes) |
<audio>: Opus in Ogg | No support | No support | 24.0 | No support | No support | No support | (Yes)23 | No support |
<video>: VP8 and Vorbis in WebM | (Yes) | 29 | 24.0 | 1.0.1 | No support | 16.0 | (Yes)24 | No support |
<video>: VP9 and Opus in WebM | ? | ? | ? | ? | ? | ? | ? | ? |
<video>: Streaming WebM via MSE | ? | ? | 42.0 (42.0) | ? | ? | ? | ? | ? |
<video>: Theora and Vorbis in Ogg | No support | No support | 24.0 | 1.0.1 | No support | No support | (Yes)25 | No support |
<video>: H.264 and MP3 in MP4 | (Yes)26 | 29 | 24.033 | (Yes)27 | 10.0 | 16.028 | (Yes)29 | (Yes) |
<video>: H.264 and AAC in MP4 | (Yes)30 | 29 | 24.034 | (Yes)31 | 10.0 | 16.028 | (Yes)32 | 3.2 |
<video>: FLAC in MP4 | ? | ? | 51.0 (51) | ? | ? | ? | ? | ? |
any other format | ? | ? | ? | ? | ? | ? | ? | ? |