Форматы медиа поддерживаемые HTML audio и video элементами

Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

<audio> и <video> элементы предоставляют поддержку для проигрывания аудио и видео медиа без нужды в плагинах. Видео кодеки и аудио кодеки используются для обработки видео и аудио, однако разные кодеки предлагают разные уровни сжатия и качества. Формат контейнер используется для хранения и передачи кодированного видео и аудио (оба вместе, для видео с звуковой дорожкой). Существует много комбинаций кодеков и форматов контейнеров, хотя лишь немногие из них актуальны в интернете.

Различные браузеры не поддерживают одни и те же форматы медиа в их реализации HTML5 video и audio, в основном из-за проблем с патентами. The area of media formats on the Web has greatly suffered from patent law in many countries  including the USA and EU countries (the notes on patents in this article is provided as-is and without any warranty.) This article discusses the different codec and container combinations relevant to the web, including support in browsers on both desktop and other device types.

Для отображения видео используя HTML5, который работает во всех новых версиях мажорных браузеров, ты можешь подавать твоё видео в обоих WebM формат и MPEG H.264 AAC формат, используя <source> элемент как этот:

<video controls>
  <source src="somevideo.webm" type="video/webm">
  <source src="somevideo.mp4" type="video/mp4">
  Сожалею; ваш браузер не поддерживает HTML5 видео в WebM с VP8 или MP4 с H.264.
  <!-- Ты можешь встроить флеш плеер сюда, для воспроизведения твоего mp4 видео в старых браузерах -->
</video>

WebM

Формат WebM основан на ограниченной версии формата контейнера Matroska. It always uses the VP8 or VP9 video codec and the Vorbis or Opus audio codec. WebM is natively supported in desktop and mobile Gecko (Firefox), Chrome and Opera, and support for the format can be added to Internet Explorer and Safari (but not on iOS) by installing an add-on.

Statement from Microsoft on why IE9 does not have native WebM support.

The WebM format, specifically the VP8 video codec, had been acccused of patent infringment by a group of companies answering a call by the MPEG LA for the formation of a patent pool, but MPEG LA has agreed to license those patents to Google under a "perpetual, transferable, royalty free license".  This means, effectively, that all known patents on the WebM format are licensed to everyone for free. 

Gecko recognizes the following MIME types as WebM files:

video/webm
A WebM media file containing video (and possibly audio as well).
audio/webm
A WebM media file containing only audio.

Ogg Theora Vorbis

The Ogg container format with the Theora video codec and the Vorbis audio codec is supported in desktop/mobile Gecko (Firefox), Chrome, and Opera, and support for the format can be added to Safari (but not on iOS) by installing an add-on. The format is not supported in Internet Explorer in any way.

WebM is generally preferred over Ogg Theora Vorbis when available, because it provides a better compression to quality ratio and is supported in more browsers. The Ogg format can however be used to support older browser versions (for example Firefox 3.5/3.6 don't support WebM, but do support Ogg.)

The patent situation of Theora is similar to that of WebM.

You can learn more about creating Ogg media by reading the Theora Cookbook.

Gecko recognizes the following MIME types as Ogg files:

audio/ogg
An Ogg file containing only audio.
video/ogg
An ogg file containing video (and possibly also audio).
application/ogg
An Ogg file with unspecified content. Using one of the other two MIME types is preferred, but you can use this if you don't know what the contents of the file are.

Ogg Opus

The Ogg container can also contain audio encoded using the Opus codec. Support for this is available in Gecko 15.0 (Firefox 15.0 / Thunderbird 15.0 / SeaMonkey 2.12) and later, on desktop and mobile browsers.

MP4 H.264 (AAC or MP3)

The MP4 container format with the H.264 video codec and the AAC audio codec is natively supported by desktop/mobile Internet Explorer, Safari and Chrome, but Chromium and Opera do not support the format. IE and Chrome also support the MP3 audio codec in the MP4 container, but Safari does not. Firefox/Firefox for Android/Firefox OS supports the format in some cases, but only when a third-party decoder is available, and the device hardware can handle the profile used to encode the MP4.

Note: MP4s encoded with a high profile will not run on lower end hardware, such as low end Firefox OS phones.

The MPEG media formats are covered by patents, which are not freely licensed. All the necessary licenses can be bought from MPEG LA. Since H.264 is currently not a royalty free format, it is unfit for the open web platform, according to Mozilla [1, 2], Google [1, 2] and Opera. However, since royalty free formats are not supported by Internet Explorer and Safari, Mozilla has decided to support the format anyway, and Google never fulfilled their promise to remove support for it in Chrome.

MP3

MP3 аудио формат (.mp3, audio/mpeg; в отличии от выше MP3 аудио в случае MP4 контейнера) поддерживается в <audio> Firefox/Firefox для Android/Firefox OS когда операционая система обеспечивает MP3 декодер, и Internet Explorer, Chrome и Safari.

WAVE PCM

The WAVE container format, with the PCM audio codec (WAVE codec "1") is supported by desktop/mobile Gecko (Firefox) and Safari. Files in the WAVE container format typically end with the ".wav" extension.

Note: See RFC 2361 for the WAVE codec registry.

Gecko recognizes the following MIME types as WAVE audio files:

  • audio/wave (preferred; does not work in Chrome)
  • audio/wav
  • audio/x-wav
  • audio/x-pn-wav

Media Source Extensions (MSE)

Media Source Extensions is a W3C working draft that plans to extend 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. This currently has experimental support in Firefox desktop, and other browsers too.

For example,  you could implement MPEG-DASH using JavaScript while offloading the decoding to MSE.

Note: Time Shifting is the process of consuming a live stream some time after it happened.

Browser compatibility

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 (Да) 3.5 (1.9.1) Нет 10.50 3.1
<audio>: Vorbis in WebM (Да) 4.0 (2.0) Нет 10.60 3.1 (must be installed separately)
<audio>: Streaming Vorbis in WebM via Media Source Extensions (MSE) ? 36.0 (36.0) in Nightly/Dev edition only ? ? ?
<audio>: Vorbis in Ogg (Да) 3.5 (1.9.1) Нет 10.50 3.1 (must be installed separately, e.g. XiphQT)
<audio>: MP3 (Да) (Not in Chromium) Partial (see below) 9.0 (Да) 3.1
<audio>: MP3 in MP4

?

? ? ? (Да)
<audio>: AAC in MP4

(Да) (Main only) (Not in Chromium)

Partial (see below)

9.0 (Да) 3.1
<audio>: Opus in Ogg 27.0 15.0 (15.0) ? ? ?
<video>: VP8 and Vorbis in WebM 6.0 4.0 (2.0) 9.0 (must be installed separately, e.g. WebM MF) 10.60 3.1 (must be installed separately, e.g. Perian)
<video>: VP9 and Opus in WebM 29.0 28.0 (28.0) ? (Да) ?
<video>: Streaming VP9 and Opus/VP8 and Opus in WebM via Media Source Extensions (MSE) ? 36.0 (36.0) in Nightly/Dev edition only ? ? ?
<video>:  Theora and Vorbis in Ogg (Да) 3.5 (1.9.1) Нет 10.50 3.1 (must be installed separately, e.g. XiphQT)
<video>:  H.264 and MP3 in MP4

(Да) (Not in Chromium)

Partial (see below) 9.0 (Да) (Да)
<video>: H.264 and AAC in MP4

(Да) (Not in Chromium)

Partial (see below) 9.0 (Да) 3.1
any other format Нет Нет Нет Нет 3.1 (plays all formats available via QuickTime)
Feature Android Firefox Mobile (Gecko) Firefox OS (Gecko) IE Mobile Opera Mobile Opera Mini Safari Mobile Chrome for Android
Basic support 2.3 24.0 1.0.1 10.0 11.0 Partial (see below) 3.2 29.0
<audio>: PCM in WAVE ? 24.0 1.0.1 Нет Нет Partial (see below) 3.2 ?
<audio>: Vorbis in WebM ? 24.0 1.0.1 Нет 11.0 Partial (see below) Нет ?
<audio>: Streaming Vorbis in WebM via Media Source Extensions (MSE) ? ? ? ? ? ? ? ?
<audio>: Vorbis in Ogg ? 24.0 1.0.1 Нет 11.0 Partial (see below) Нет ?
<audio>: MP3 ? Partial (see below) Partial (see below) 10.0 ? Partial (see below) 3.2 ?
<audio>: MP3 in MP4 ? ? ? ? ? ? (Да) ?
<audio>: AAC in MP4 ? Partial (see below) Partial (see below) 10.0 ? Partial (see below) (Да) ?
<audio>: Opus in Ogg Нет 24.0 Нет Нет Нет Partial (see below) Нет Нет
<video>:  VP8 and Vorbis in WebM 2.3 24.0 1.0.1 Нет 16.0 Partial (see below) Нет 29.0
<video>: VP9 and Opus in WebM ? ? ? ? ? ? ? ?
<video>: Streaming VP9 and Opus/VP8 and Opus in WebM via Media Source Extensions (MSE) ? ? ? ? ? ? ? ?
<video>: Theora and Vorbis in Ogg Нет 24.0 1.0.1 Нет Нет Partial (see below) Нет Нет
<video>:  H.264 and MP3 in MP4 Partial (see below) 24.0 Partial (see below) 10.0 Partial since 11.0, full since 16.0 Partial (see below) (Да) 29.0
<video>: H.264 and AAC in MP4 Partial (see below) 24.0 Partial (see below) 10.0 Partial since 11.0, full since 16.0 Partial (see below) 3.2 29.0
any other format ? ? ? ? ? ? ? ?

Notes:

  • AAC is only supported in the MP4 container.
  • Opera Mini itself doesn't support any video or audio, but any video or audio is passed to the device to play if it has support for that format. Opera Mobile also does this with unsupported formats.
  • To get the default Android browser to play H.264 video, you need to jump through some hoops, as explained by Peter Gasston.
  • In Firefox OS 1.0.1, when detecting <video> support for different formats, HTMLMediaElement.prototype.canPlayType incorrectly reports true for h.264 video whereas in actual fact h.264 is not supported. In Firefox OS 1.1 this problem has been fixed.
  • To avoid patent issues, support for MPEG 4, H.264, MP3 and AAC is not built directly into Firefox on desktop and mobile (Android and Firefox OS). Instead it relies on support from the OS or hardware (the hardware also needs to be able to support the profile used to encode the video, in the case of MP4). Firefox desktop supports these formats on the following platforms:
Platform Firefox version
Windows Vista+ 22.0+
Android 20.0+
Firefox OS 15.0+
Linux

26.0+ (relies on GStreamer codecs)

OS X 10.7+ 35.0+

See also

Метки документа и участники

 Внесли вклад в эту страницу: MuradAz
 Обновлялась последний раз: MuradAz,