Элемент <audio> представляет звук или аудиопоток. [1] Обычно он используется для воспроизведения одного аудиофайла на веб-странице, показывая виджет графического интерфейса пользователя с элементами управления воспроизведением / паузой / громкостью.
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 = "приглушено" или "" (пустая строка) или пусто Представляет состояние аудиопотока по умолчанию, потенциально отменяющее пользовательские настройки.
< управление звуком > < 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
Опера
Сафари
PCM
WAV
аудио / wav
да
Нет
да
Да, в версии 3.5
Да, в версии 11.00
Да, в версии 3.1
MP3
MP3
аудио / MPEG
Да [13]
Да, в IE9
да
Да, в версии 71 [14]
Да [13]
Да, в версии 3.1
AAC
MP4
аудио / mp4
да
Да, в IE9
да
Из ОС [a]
да
да
ADTS [b]
аудио / AAC аудио / AACP
да
Нет
да
Из ОС [a] в версии 45.0
да
да
Vorbis
Ogg
audio / 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
Нет
Opus
Ogg
audio / 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
FLAC
FLAC
audio / flac
Да, в версии 56 [20]
Нет
Да, в версии 16 [21]
Да, в версии 51 [22]
да
Да, в версии 11 [23]
Ogg
audio / 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
Примечания
^ a b Кодек AAC не поддерживается по причинам лицензирования. Для декодирования аудиофайлов ОС хоста должна предоставить совместимую библиотеку. [15]
^ Файл MPEG-4 содержит заголовок, который включает метаданные, за которыми следуют «дорожки», которые могут включать видео, а также аудиоданные, например, видео в кодировке H.264 и аудио в кодировке AAC. Напротив, ADTS - это потоковый формат, состоящий из серии кадров, каждый из которых имеет заголовок, за которым следуют данные AAC. [6]
использованная литература
^ "Аудиоэлемент HTML5 - W3C" . Архивировано из оригинала на 2013-06-06 . Проверено 2 июля 2013 .
^ https://www.w3.org/wiki/HTML/Elements/audio
^ a b Об аудио и видео HTML5 - Руководство по аудио и видео в Safari HTML5
^ Можно ли воспроизвести этот поток с помощью HTML5 / javascript?
^ «Поддержка WebM, VP9 и Opus в Microsoft Edge - Блог разработчиков Microsoft EdgeБлог разработчиков Microsoft Edge» . blogs.windows.com . Проверено 22 марта 2017 .
^ a b «Включить поддержку mp3 в Chromium» . Google . Проверено 1 мая 2018 .
^ «Примечания к выпуску Firefox 71.0» . Mozilla. 3 декабря 2019.
^ «Руководство по типам и форматам носителей: изображения, аудио и видео» . Сеть разработчиков Mozilla . Mozilla . Проверено 6 декабря 2019 .
^ a b https://developer.microsoft.com/en-us/microsoft-edge/status/vorbisaudiocodec/
^ a b c d e «Представляем пакет расширения веб-медиа с поддержкой OGG Vorbis и Theora для Microsoft Edge» . Блог разработчиков Microsoft Edge . Microsoft . 5 декабря 2017 года.
^ a b https://developer.microsoft.com/en-us/microsoft-edge/status/opusaudioplayback/
^ Крис Роджерс (2012-03-15). «API веб-аудио» . W3C . Архивировано из оригинала на 2012-03-15 . Проверено 4 июля 2012 .
^ «API аудиоданных» .
^ «Представляем расширение Audio API» . Сеть разработчиков Mozilla . Mozilla . 2012-03-05. Архивировано из оригинала на 2014-01-16 . Проверено 4 июля 2012 .
^ «API обработки звука» . W3C . 2011-12-15. Архивировано из оригинала на 2011-12-15 . Проверено 4 июля 2012 .
^ Роберт O'Callahan (2012-05-31). «MediaStream Processing API» . W3C . Проверено 4 июля 2012 .
^ API веб-аудио теперь доступен в Chrome
↑ Скотт Гилбертсон (19 сентября 2011 г.). «Chrome 14 добавляет улучшенный звук, поддержка« родного клиента »» . Webmonkey . Проводной . Проверено 4 июля 2012 .
^ «Проект API» . Проверено 28 января 2012 года .
^ "HTML5 Speech API" . Проверено 28 января 2012 года .
^ «Разговор с компьютером» . Проверено 28 января 2012 года .
^ «Firefox 44 для разработчиков - Mozilla | MDN» . Проверено 9 марта 2016 года .
^ «Firefox - Примечания (45.0) - Mozilla» . Проверено 9 марта 2016 года .
^ "Web Speech API - Web API | MDN" . Проверено 9 марта 2016 года .