Воспроизведение аудио с помощью Javascript?

это просто, просто получить ваш audio элемент и называем play() способ:

document.getElementById('yourAudioTag').play();

проверьте этот пример:http://www.storiesinflight.com/html5/audio.html

этот сайт раскрывает некоторые другие интересные вещи вы можете сделать, такие как load(),pause(), и несколько других свойств audio элемент.

http://www.schillmania.com/projects/soundmanager2/

SoundManager 2 предоставляет простой в использовании API, который позволяет воспроизводить звук в любом современном браузере, включая IE 6+. Если браузер не поддерживает HTML5, то он получает помощь от flash. Если вы хотите строго HTML5 и без вспышки, есть настройка для этого, preferFlash=false

Он поддерживает 100% Flash-free audio на iPad, iPhone (iOS4) и других устройствах с поддержкой HTML5 + браузеры

использовать в просто как:

<script src="soundmanager2.js"></script>
<script>
    // where to find flash SWFs, if needed...
    soundManager.url = '/path/to/swf-files/';

    soundManager.onready(function() {
        soundManager.createSound({
            id: 'mySound',
            url: '/path/to/an.mp3'
        });

        // ...and play it
        soundManager.play('mySound');
    });
</script>

вот демонстрация этого в действии:http://www.schillmania.com/projects/soundmanager2/demo/christmas-lights/

Это довольно старый вопрос, но я хочу добавить немного полезной информации. Стартер темы упомянул, что он "making a game". Так что для всех, кто нуждается в аудио для разработки игр есть лучший выбор, чем просто <audio> тег или HTMLAudioElement. Я думаю, что вы должны рассмотреть использование Web Audio API:

в то время как аудио в интернете больше не требует плагина, аудио тег приносит значительные ограничения для реализации сложных игр и интерактивных приложения. Web Audio API-это высокоуровневый JavaScript API для обработки и синтеза звука в веб-приложениях. Цель этого API состоит в том, чтобы включить возможности, найденные в современных игровых аудио движках и некоторых задачах смешивания, обработки и фильтрации, которые находятся в современных настольных аудио производственных приложениях.

легко с Jquery

/ / установить аудио теги без предварительной загрузки

<audio class="my_audio" controls preload="none">
    <source src="audio/my_song.mp3" type="audio/mpeg">
    <source src="audio/my_song.ogg" type="audio/ogg">
</audio>

/ / добавить jquery для загрузки

$(".my_audio").trigger('load');

// методы записи для воспроизведения и остановки

function play_audio(task) {
      if(task == 'play'){
           $(".my_audio").trigger('play');
      }
      if(task == 'stop'){
           $(".my_audio").trigger('pause');
           $(".my_audio").prop("currentTime",0);
      }
 }

// решение, как управлять аудио

<button onclick="play_audio('play')">PLAY</button>
<button onclick="play_audio('stop')">STOP</button>

EDIT

чтобы ответить на вопрос @ stomy, вот как вы могли бы использовать этот подход, чтобы играть в плейлист:

установить свои песни в объект:

playlist = {
    'song_1' : 'audio/splat.mp3',
    'song_2' : 'audio/saw.mp3',
    'song_3' : 'audio/marbles.mp3',
    'song_4' : 'audio/seagulls.mp3',
    'song_5' : 'audio/plane.mp3'
}

используйте триггер и функции воспроизведения, как и раньше:

$(".my_audio").trigger('load');

function play_audio(task) {
      if(task == 'play'){
           $(".my_audio").trigger('play');
      }
      if(task == 'stop'){
           $(".my_audio").trigger('pause');
           $(".my_audio").prop("currentTime",0);
      }
 }

загрузите первую песню динамически:

keys = Object.keys(playlist);
$('.my_audio').append("<source id='sound_src' src=" + playlist[keys[0]] + " type='audio/mpeg'>");

сброс источника звука к следующей песне в списке воспроизведения, когда текущая песня заканчивается:

count = 0; 
$('.my_audio').on('ended', function() { 
   count++;  
   $("#sound_src").attr("src", playlist[keys[count]])[0];
   $(".my_audio").trigger('load');
   play_audio('play');
});

посмотреть здесь для примера этого кода в действии.

new Audio('./file.mp3').play()

добавить скрытый звук и воспроизвести его.

function playSound(url){
  var audio = document.createElement('audio');
  audio.style.display = "none";
  audio.src = url;
  audio.autoplay = true;
  audio.onended = function(){
    audio.remove() //Remove when played.
  };
  document.body.appendChild(audio);
}

довольно простое решение, если у вас есть HTML-тег, как показано ниже:

<audio id="myAudio" src="some_audio.mp3"></audio>

просто используйте JavaScript, чтобы играть в нее, вот так:

document.getElementById('myAudio').play();

если вы получаете следующее сообщение об ошибке:

Uncaught (in promise) DOMException: play () не удалось, потому что пользователь сначала не взаимодействовал с документом.

это означает, что пользователь должен сначала взаимодействовать с веб-сайтом (как говорится в сообщении об ошибке). В этом случае вам нужно использовать click или просто другой прослушиватель событий, так что пользователь может взаимодействовать с вашим сайтом.

если вы хотите автоматически загружать аудио и не хотите, чтобы пользователь сначала взаимодействуйте с документом, вы можете использовать setTimeout.

setTimeout(() => {
  document.getElementById('mySound').play();
}, 500)

<audio id="mySound" src="sound.mp3"></audio>

звук начнется через 0,5 секунды.

я использовал этот метод для воспроизведения звука...

var audioElement;
if(!audioElement) {
  audioElement = document.createElement('audio');
  audioElement.innerHTML = '<source src="' + '/audio/sound.mp3'+ '" type="audio/mpeg" />'
}
audioElement.play();

Если вы хотите воспроизводить аудио всякий раз, когда страница открыта, то сделайте так.

<script>
  function playMusic(){
  music.play();
  }
  </script>
<html>
  <audio id="music" loop src="sounds/music.wav" autoplay> </audio>
  </html>

и вызовите этот playMusic () всякий раз, когда вам нужно в вашем коде игры.

var song = new Audio();
song.src = 'file.mp3';
song.play();

вы можете использовать Web Audio API для воспроизведения звуков. Есть довольно много аудиотек, таких как howler.js, soundjs и др. Если вы не беспокоитесь о старых браузерах, то вы также можете проверить на http://musquitojs.com/. он предоставляет простой API для создания и воспроизведения звуков.

например, для воспроизведения звука все, что вам нужно сделать, это.

import $buzz from 'musquito';

const buzz = $buzz('gunfire.mp3');

buzz.play();

библиотека также поддерживает аудио спрайты.