HTML5 предоставляет стандарт для воспроизведения звуковых файлов.
HTML5 Audio является предметом спецификации HTML5, включая аудио вход, воспроизведение и синтез, а также речи в текст, в браузере.
Аудио в Интернете
Перед тем как HTML5, не было никакого стандарта для проигрывания аудио файлов на веб-странице.
Перед HTML5, аудио файлы могут быть воспроизведены только с плагином (like flash) .
HTML5 <audio> элемент определяет стандартный способ вставлять аудио на веб - странице.
Поддержка браузеров
Числа в таблице указать первую версию браузера , которая полностью поддерживает <audio> элемент.
| Элемент | |||||
|---|---|---|---|---|---|
| <audio> | 4,0 | 9,0 | 3,5 | 4,0 | 10,5 |
HTML <audio> Элемент
Для воспроизведения звукового файла в формате HTML, используйте <audio> элемент:
пример
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio> Попробуй сам " Элемент <аудио> представляет собой звук, или звуковой поток. Она обычно используется для воспроизведения одного звукового файла в веб-страницы, показывая GUI виджет с элементами управления воспроизведения / паузы / громкости.
Элемент <аудио> имеет следующие атрибуты:
глобальные атрибуты (Accesskey; класс; contenteditable; Контекстное; реж; перетаскиваемым; Dropzone, скрытый; ID; языки; проверка орфографии; стиль; TabIndex; название; перевод)
автозапуск = «автозапуск» или «» (пустая строка) или пустой Инструктирует User-Agent автоматически начать воспроизведение аудиопотока, как только он может сделать это без остановки.
преднагрузки = «нет» или «метаданные» или «Авто» или «» (пустая строка) или пустое Представляет подсказку к User-Agent о том, считаются ли стоит оптимистичной загрузка самого или его метаданные аудиопотока.
«Никто»: Подсказки к User-Agent, что пользователь не ожидаются, нужен аудиопоток, или что сведение к минимуму ненужного трафика желательно.
«Метаданные»: Подсказки к User-Agent, что пользователь не ожидается, нужно аудиопоток, но что извлечение его метаданные (продолжительность и так далее) желательно.
«Авто»: Подсказки к User-Agent, который оптимистически скачивании весь звуковой поток считается желательным.
управление = «управление» или «» (пустая строка) или пустая Инструктирует User-Agent, чтобы выставить пользовательский интерфейс для управления воспроизведением аудио потока.
цикл = «петля» или «» (пустая строка) или пустая Инструктирует User-Agent искать обратно в начало звукового потока при достижении конца. Медиагруппа = строка Инструктирует User-Agent связать несколько видео и / или аудио потоки вместе.
приглушен = «приглушенный» или «» (пустая строка) или пустой Представляет собой состояние по умолчанию аудиопотока, потенциально перекрывая предпочтения пользователя. SRC = непустой [URL] потенциально окружен пробелами URL-адрес для аудиопотока.
HTML Audio - Как это работает
В controls атрибутом добавляет элементы управления аудио, как воспроизведение, пауза, и объем.
Текст между <audio> и </audio> теги будут отображаться в браузерах , которые не поддерживают <audio> элемент.
Множественные <source> элементы можно связать с различными звуковыми файлами. Браузер будет использовать первый признанный формат.
HTML Audio - Поддержка браузеров
В настоящее время существует 3 Поддерживаемые форматы файлов для <audio> элемент: MP3, Wav, Ogg и:
| браузер | MP3 | Wav | Ogg |
|---|---|---|---|
| Internet Explorer | YES | NO | NO |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | YES | NO |
| Opera | YES | YES | YES |
HTML Audio - Типы носителей
| Формат файла | Тип носителя |
|---|---|
| MP3 | audio/mpeg |
| Ogg | audio/ogg |
| Wav | audio/wav |
HTML Audio - методы, свойства и события
HTML5 определяет методы DOM, свойства и события для <audio> элемента.
Это позволяет загружать, играть, и приостановка воспроизведения аудиофайлов, а также длительность набора и объема.
Есть также DOM событие, которые могут уведомить вас, когда аудио начинает играть, пауза и т.д.
Для полной ссылки DOM, перейдите на наш HTML5 Audio / Video DOM Reference .
HTML5 Аудио Ключевые слова
| Тег | Описание |
|---|---|
| <audio> | Определяет содержание звука |
| <source> | Определяет несколько ресурсов медиа для медиа - элементов, таких как <video> и <audio> |
HTML Audio - Web Speech API
Веб-Speech API призван обеспечить альтернативный способ ввода для веб-приложений (без использования клавиатуры). С помощью этого API, разработчики могут дать веб-приложения возможности расшифровать голос в текст, от микрофона компьютера. Записанный звук передается к речевым серверов для транскрипции, после чего текст набирается за пользователем. Сам API-агностик базового осуществления распознавания речи и может поддерживать как сервер на основе, а также встроенные распознаватели. Группа HTML Speech Инкубатор предложила реализацию аудио-речевых технологий в браузерах в виде API, равномерный, кросс-платформенного. API содержит как:
- Речевой Input API
- Текст Speech API