Как воспроизвести аудио в js
Ответы
Вячеслав Межуревский
01 октября 2022
Для добавления элемента на страницу который, воспроизводит и управляет настройками аудиозаписи можно использовать тег <audio>. Путь к файлу задается через атрибут src или вложенный тег <source>. Внутри контейнера <audio> можно написать текст, который будет выводиться в браузерах, не работающих с этим тегом.
Пример:
<audio controls>
<source src="audio/music.ogg" type="audio/ogg; codecs=vorbis">
<source src="audio/music.mp3" type="audio/mpeg">
Тег audio не поддерживается вашим браузером.
<a href="audio/music.mp3">Скачайте музыку</a>.
</audio>
Существуют и аудиобиблиотеки Javascript предоставляющие более широкие возможности, например howlerjs
Рассмотрим простой пример:
Исходный HTML файл:
<button onclick="sound.play();">Play</button>
Скрипт для подключения библиотеки Howler:
<!-- Подключаем библиотеку howler через cdn сеть в наш HTML документ -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.2.3/howler.js"></script>
<!-- создаем экземпляр объекта Howl и в опции src указываем путь до файла,
сам файл необходимо разместить рядом с HTML документом -->
<script>
var sound = new Howl({
src: ['music.mp3'],
<!-- Можно, например выставить громкость -->
volume: 0.5,
<!-- Включить зацикливание проигрывания файла -->
loop: true,
});
</script>
0
0