Из Википедии, бесплатной энциклопедии
Перейти к навигации Перейти к поиску
«Аудиотег» перенаправляется сюда. Для метаданных, описывающих цифровой звук, см. Метаданные § Цифровая музыка .
HTML
Сравнения

HTML5 Audio является предметом спецификации HTML5 , включающей аудиовход, воспроизведение и синтез , а также преобразование речи в текст в браузере.

<audio> элемент [ править ]

Элемент <audio> представляет звук или аудиопоток. [1] Обычно он используется для воспроизведения одного аудиофайла на веб-странице, показывая виджет графического интерфейса пользователя с элементами управления воспроизведением / паузой / громкостью.

Элемент <audio> имеет следующие атрибуты:

  • глобальные атрибуты (accesskey; class; contenteditable; contextmenu; dir; draggable; dropzone; hidden; id; lang; spellcheck; style; tabindex; title; translate)
  • autoplay = "autoplay" или "" (пустая строка) или empty
    Дает указание агенту пользователя автоматически начать воспроизведение аудиопотока, как только он сможет это сделать, без остановки.
  • preload = "none", или "metadata", или "auto", или "" (пустая строка), или empty.
    Представляет подсказку для User-Agent о том, стоит ли оптимистичная загрузка самого аудиопотока или его метаданных.
    • «none»: подсказывает User-Agent, что пользователю не нужен аудиопоток или что желательно минимизировать ненужный трафик.
    • «метаданные»: подсказывает User-Agent, что пользователю не требуется аудиопоток, но желательно получить его метаданные (продолжительность и т. д.).
    • "auto": подсказывает User-Agent, что оптимистическая загрузка всего аудиопотока считается желательной.
  • controls = "controls" или "" (пустая строка) или empty
    Дает указание User-Agent открыть пользовательский интерфейс для управления воспроизведением аудиопотока.
  • loop = "loop" или "" (пустая строка) или empty
    Дает указание агенту пользователя вернуться к началу аудиопотока по достижении конца.
  • mediagroup = string Дает
    указание агенту пользователя связать вместе несколько видео и / или аудиопотоков.
  • muted = "приглушено" или "" (пустая строка) или пусто
    Представляет состояние аудиопотока по умолчанию, потенциально отменяющее пользовательские настройки.
  • src = непустой [URL], потенциально окруженный пробелами
    URL-адрес аудиопотока.

Пример: [2]

< элементы управления звуком  > < source src = "https://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.mp4" type = "audio / mp4" /> < source src = "https: // media .w3.org / 2010/07 / bunny / 04-Death_Becomes_Fur.oga " type = " audio / ogg; codecs = vorbis " /> < p > Ваш пользовательский агент не поддерживает элемент HTML5 Audio. </ p > </ audio >

Поддерживающие браузеры [ править ]

На ПК:

  • Гугл Хром
  • Internet Explorer 9
  • Firefox 3.5
  • Opera 10.5
  • Safari 3.1 [3]

На мобильных устройствах:

  • Браузер Android 2.3
  • Браузер Blackberry
  • Гугл Хром
  • Internet Explorer Mobile 9
  • Safari 4 [3]
  • Fire Fox
  • Opera Mobile 11

Поддерживаемые форматы кодирования звука [ править ]

Принятие аудио HTML5, как и видео HTML5 , стало поляризованным между сторонниками бесплатных и обремененных патентами форматов. В 2007 году рекомендация использовать Vorbis была исключена из спецификации W3C вместе с рекомендацией использовать Ogg Theora , сославшись на отсутствие формата, принятого всеми основными поставщиками браузеров.

Apple , и Microsoft поддерживают ISO / IEC - определенные форматы AAC и старшую MP3 . Mozilla и Opera поддерживают бесплатный и открытый формат Vorbis , не требующий лицензионных отчислений, в контейнерах Ogg и WebM и критикуют обремененный патентами характер MP3 и AAC, которые гарантированно являются «несвободными». На данный момент Google поддерживает все распространенные форматы.

Большинство файлов AAC с конечной длиной заключены в контейнер MPEG-4 (.mp4, .m4a), который изначально поддерживается в Internet Explorer, Safari и Chrome и поддерживается ОС в Firefox и Opera. [4] Большинство прямых трансляций AAC с бесконечной длиной заключены в контейнер транспортного потока аудиоданных (.aac, .adts), который поддерживается Chrome, Safari, Firefox и Edge. [5] [6] [7]

Многие браузеры также поддерживают несжатый звук PCM в контейнере WAV E. [8]

В 2012 году IETF выпустила и стандартизировала бесплатный и открытый формат Opus без лицензионных отчислений . Он поддерживается Mozilla, Google, Opera и Edge. [9] [10] [11] [12]

Эта таблица документирует текущую поддержку форматов аудиокодирования данным <audio>элементом.

Форматы, поддерживаемые различными веб-браузерами
ФорматКонтейнерТип MIMEХромInternet ExplorerКрайFire FoxОпераСафари
PCMWAVаудио / wavдаНетдаДа, в версии 3.5Да, в версии 11.00Да, в версии 3.1
MP3MP3аудио / MPEGДа [13]Да, в IE9даДа, в версии 71 [14]Да [13]Да, в версии 3.1
AACMP4аудио / mp4даДа, в IE9даИз ОС [a]дада
ADTS [b]аудио / AAC
аудио / AACP		даНетдаИз ОС [a] в версии 45.0дада
VorbisOggaudio / oggДа, в версии 9НетВ версии 79 [16]
В версии 17 с расширениями веб-мультимедиа [17]		Да, в версии 3.5Да, в версии 10.50С компонентами Xiph QuickTime ( macOS 10.11 и более ранние версии )
WebMаудио / webmдаНетВ версии 79 [16]
В версии 17 с расширениями веб-мультимедиа [17]		Да, в версии 4.0Да, в версии 10.60Нет
OpusOggaudio / oggДа, в версии 25
(в версии 31 для Windows)		НетВ версии 79 [18]
В версии 17 с расширениями веб-медиа [17]		Да, в версии 15.0Да, в версии 14Нет
WebMаудио / webmдаНетВ версии 79 [18]
В версии 17 с расширениями веб-медиа [17]		Да, в версии 28.0 [19]даНет
CAFаудио / x-cafНетНетНетНетНетДа, в Safari 11 и macOS High Sierra
FLACFLACaudio / flacДа, в версии 56 [20]НетДа, в версии 16 [21]Да, в версии 51 [22]даДа, в версии 11 [23]
Oggaudio / oggДа, в версии 56 [20]НетВ версии 79 [24]
В версии 17 с расширениями веб-мультимедиа [17]		Да, в версии 51 [22]даНет

API веб-аудио и API обработки MediaStream [ править ]

Спецификация Web Audio API, разработанная W3C, описывает высокоуровневый JavaScript API для обработки и синтеза звука в веб-приложениях. Основная парадигма - это граф маршрутизации звука, в котором несколько объектов AudioNode соединены вместе, чтобы определить общий рендеринг звука. Фактическая обработка в основном будет происходить в базовой реализации (обычно это оптимизированный код Assembly / C / C ++), но также поддерживается прямая обработка и синтез JavaScript. [25]

Браузер Mozilla Firefox реализует аналогичное расширение API аудиоданных начиная с версии 4, реализованное в 2010 году [26] и выпущенное в 2011 году, но Mozilla предупреждает, что оно нестандартное и устаревшее, и рекомендует вместо него Web Audio API. [27] Некоторые библиотеки обработки и синтеза звука JavaScript, такие как Audiolet, поддерживают оба API.

Аудио Рабочая группа W3C также рассматривает API MediaStream обработки спецификации , разработанной Mozilla . [28] Помимо микширования и обработки звука, он охватывает более общую потоковую передачу мультимедиа, включая синхронизацию с элементами HTML, захват аудио- и видеопотоков и одноранговую маршрутизацию таких потоков мультимедиа. [29]

Поддерживающие браузеры [ править ]

На ПК:

  • Google Chrome 10 [30] (включен по умолчанию с 14 [31] )
  • Firefox 23 (включен по умолчанию с 25)
  • Опера 15
  • Safari 6
  • Microsoft Edge 12

На мобильных устройствах:

  • Google Chrome для Android 28 (включен по умолчанию с 29)
  • Safari 6 (имеет ограничения на использование (отключен, если пользователь не вызвал))
  • Firefox 23 (включен по умолчанию с 25)
  • Tizen

Web Speech API [ править ]

В Web - Speech API направлен на создание альтернативного способа ввода для веб - приложений (без использования клавиатуры). С помощью этого API разработчики могут дать веб-приложениям возможность транскрибировать голос в текст с микрофона компьютера. Записанный звук отправляется на речевые серверы для транскрипции, после чего текст печатается для пользователя. Сам API не зависит от базовой реализации распознавания речи и может поддерживать как серверные, так и встроенные распознаватели. [32] Группа HTML Speech Incubator предложила реализовать технологию аудио-речи в браузерах в форме унифицированных межплатформенных API. API содержит оба: [33]

  • Речевой ввод API
  • Текст в речь API

Google интегрировал эту функцию в Google Chrome в марте 2011 года. [34] Разрешив пользователям выполнять поиск в Интернете своим голосом, используя такой код, как:

< script  type = "application / javascript" >  функция  startSearch ( событие )  {  событие . цель . форма . submit ();  } </ script > < form  action = "http://www.google.com/search" >  < input  type = "search"  name = "q"  требуется речь  onspeechchange = "startSearch" > </ form >

Поддерживающие браузеры [ править ]

  • Safari 6.1 и выше [ЧАСТИЧНО: только синтез речи; без признания]
  • Google Chrome 25 и выше
  • Firefox Desktop 44.0 и выше (Linux и Mac) / 45.0 и выше (Windows) [ЧАСТИЧНО: только синтез речи; нет признания; в настоящее время требуется, чтобы параметр "media.webspeech.recognition.enable" about: config был вручную изменен на "true"] [35] [36] [37]

См. Также [ править ]

  • HTML5 видео
  • Использование форматов Ogg в HTML5

Заметки [ править ]

  1. ^ a b Кодек AAC не поддерживается по причинам лицензирования. Для декодирования аудиофайлов ОС хоста должна предоставить совместимую библиотеку. [15]
  2. ^ Файл MPEG-4 содержит заголовок, который включает метаданные, за которыми следуют «дорожки», которые могут включать как видео, так и аудиоданные, например, видео в кодировке H.264 и аудио в кодировке AAC. Напротив, ADTS - это потоковый формат, состоящий из серии кадров, каждый из которых имеет заголовок, за которым следуют данные AAC. [6]

Ссылки [ править ]

  1. ^ "Аудиоэлемент HTML5 - W3C" . Архивировано из оригинала на 2013-06-06 . Проверено 2 июля 2013 .
  2. ^ https://www.w3.org/wiki/HTML/Elements/audio
  3. ^ a b Об аудио и видео HTML5 - Руководство по аудио и видео в Safari HTML5
  4. ^ Можно ли воспроизвести этот поток с помощью HTML5 / javascript?
  5. ^ Контейнер MP4 · Проблема № 95 · karlheyes / icecast-kh · GitHub
  6. ^ a b https://developer.apple.com/library/ios/technotes/tn2236/_index.html#//apple_ref/doc/uid/DTS40008748-CH1-SECTION5
  7. ^ https://bugzilla.mozilla.org/show_bug.cgi?id=1224887
  8. ^ https://developer.mozilla.org/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements
  9. ^ https://developer.mozilla.org/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements#Ogg_Opus
  10. ^ https://www.xiph.org/press/2012/rfc-6716/
  11. ^ https://hacks.mozilla.org/2012/09/its-opus-it-rocks-and-now-its-an-audio-codec-standard/
  12. ^ «Поддержка WebM, VP9 и Opus в Microsoft Edge - Блог разработчиков Microsoft EdgeБлог разработчиков Microsoft Edge» . blogs.windows.com . Проверено 22 марта 2017 .
  13. ^ a b «Включить поддержку mp3 в Chromium» . Google . Проверено 1 мая 2018 .
  14. ^ «Примечания к выпуску Firefox 71.0» . Mozilla. 3 декабря 2019.
  15. ^ «Руководство по типам и форматам носителей: изображения, аудио и видео» . Сеть разработчиков Mozilla . Mozilla . Проверено 6 декабря 2019 .
  16. ^ a b https://developer.microsoft.com/en-us/microsoft-edge/status/vorbisaudiocodec/
  17. ^ a b c d e «Представляем пакет расширения веб-медиа с поддержкой OGG Vorbis и Theora для Microsoft Edge» . Блог разработчиков Microsoft Edge . Microsoft . 5 декабря 2017 года.
  18. ^ a b https://developer.microsoft.com/en-us/microsoft-edge/status/opusaudioplayback/
  19. ^ https://www.mozilla.org/en-US/firefox/28.0/releasenotes/
  20. ^ a b «Поддержка кодеков FLAC для <audio> и WebAudio» . Статус платформы Chrome . Проверено 27 декабря 2016 .
  21. ^ https://developer.microsoft.com/en-us/microsoft-edge/status/flacaudiocodec/
  22. ^ a b «Firefox 51 для разработчиков» . Сеть разработчиков Mozilla . Проверено 27 декабря 2016 .
  23. ^ Хаим Гартенберг (6 июня 2017). «Сообщается, что Apple добавляет поддержку аудио без потерь в формате FLAC в iOS 11» . Грань .
  24. ^ https://developer.microsoft.com/en-us/microsoft-edge/status/oggcontainer/
  25. ^ Крис Роджерс (2012-03-15). «API веб-аудио» . W3C . Архивировано из оригинала на 2012-03-15 . Проверено 4 июля 2012 .
  26. ^ «API аудиоданных» .
  27. ^ «Представляем расширение Audio API» . Сеть разработчиков Mozilla . Mozilla . 2012-03-05. Архивировано из оригинала на 2014-01-16 . Проверено 4 июля 2012 .
  28. ^ «API обработки звука» . W3C . 2011-12-15. Архивировано из оригинала на 2011-12-15 . Проверено 4 июля 2012 .
  29. ^ Роберт O'Callahan (2012-05-31). «MediaStream Processing API» . W3C . Проверено 4 июля 2012 .
  30. ^ API веб-аудио теперь доступен в Chrome
  31. ↑ Скотт Гилбертсон (19 сентября 2011 г.). «Chrome 14 добавляет улучшенный звук, поддержка« родного клиента »» . Webmonkey . Проводной . Проверено 4 июля 2012 .
  32. ^ «Проект API» . Проверено 28 января 2012 года .
  33. ^ «HTML5 Speech API» . Проверено 28 января 2012 года .
  34. ^ «Разговор с компьютером» . Проверено 28 января 2012 года .
  35. ^ «Firefox 44 для разработчиков - Mozilla | MDN» . Проверено 9 марта 2016 года .
  36. ^ «Firefox - Примечания (45.0) - Mozilla» . Проверено 9 марта 2016 года .
  37. ^ "Web Speech API - Web API | MDN" . Проверено 9 марта 2016 года .

Внешние ссылки [ править ]

  • HTML / элементы / аудио - W3C Wiki
  • Аудиоэлемент HTML5 - W3C
  • API веб-аудио - W3C
  • API обработки MediaStream - W3C
  • Web Speech API - W3C
  • Веб-аудио DAW - Github
  • API веб-аудио от Mozilla