Звуковые эффекты в JavaScript / HTML5

Я использую HTML5 для программирования игр; препятствие, с которым я столкнулся теперь, состоит в том, как играть звуковые эффекты.

Конкретные требования - немногие в числе:

  • Игра и соединение несколько звуков,
  • Играйте тот же образец многократно, возможно перекрывая воспроизведения,
  • Воспроизведение прерывания образца в любой точке,
  • Предпочтительно играйте файлы WAV, содержащие (низкое качество) необработанный PCM, но я могу преобразовать их, конечно.

Мой первый подход должен был использовать HTML5 <audio> элемент и определяет все звуковые эффекты на моей странице. Firefox играет файлы WAV, просто замечательные, но вызов #play многократно действительно не играет образец многократно. От моего понимания спецификации HTML5, <audio> элемент также отслеживает состояние воспроизведения, так, чтобы объяснил почему.

Моя непосредственная мысль состояла в том, чтобы клонировать аудио элементы, таким образом, я создал следующую крошечную библиотеку JavaScript, чтобы сделать это для меня (зависит от jQuery):

var Snd = {
  init: function() {
    $("audio").each(function() {
      var src = this.getAttribute('src');
      if (src.substring(0, 4) !== "snd/") { return; }
      // Cut out the basename (strip directory and extension)
      var name = src.substring(4, src.length - 4);
      // Create the helper function, which clones the audio object and plays it
      var Constructor = function() {};
      Constructor.prototype = this;
      Snd[name] = function() {
        var clone = new Constructor();
        clone.play();
        // Return the cloned element, so the caller can interrupt the sound effect
        return clone;
      };
    });
  }
};

Таким образом, теперь я могу сделать Snd.boom(); от консоли Firebug и игры snd/boom.wav, но я все еще не могу играть тот же образец многократно. Кажется что <audio> элемент является действительно большим количеством функции потоковой передачи, а не чем-то для проигрывания звуковых эффектов с.

Существует ли умный способ заставить это произойти, который я пропускаю, предпочтительно с помощью только HTML5 и JavaScript?

Я должен также упомянуть, что, моя тестовая среда является Firefox 3.5 на Ubuntu 9.10. Другие браузеры, которые я попробовал - Opera, Midori, Хром, Крещение - привели к переменным результатам. Некоторые ничего не играют, и некоторые выдают исключения.

314
задан vaxquis 11 July 2017 в 10:31
поделиться

5 ответов

HTML5 Аудио объекты

Вам не нужно возиться с элементами . HTML 5 позволяет напрямую обращаться к Аудио объектам :

var snd = new Audio("file.wav"); // buffers automatically when created
snd.play();

В текущей версии спецификации нет поддержки микширования.

Чтобы воспроизводить один и тот же звук несколько раз, создайте несколько экземпляров объекта Audio . Вы также можете установить snd.currentTime = 0 для объекта после того, как он завершит воспроизведение.


Поскольку конструктор JS не поддерживает резервные элементы , вы должны использовать

(new Audio()).canPlayType("audio/ogg; codecs=vorbis")

, чтобы проверить, поддерживает ли браузер Ogg Vorbis.


Если вы пишете игру или музыкальное приложение (больше, чем просто плеер), вы захотите использовать более продвинутый API веб-аудио ,

445
ответ дан 23 November 2019 в 01:08
поделиться

Невозможно выполнить многократное воспроизведение с одним элементом .

1
ответ дан 23 November 2019 в 01:08
поделиться

Похоже, вам нужны многоканальные звуки. Предположим, у вас есть 4 канала (как в действительно старых 16-битных играх), я еще не успел поиграть с функцией аудио HTML5, но разве вам не нужны просто 4 элемента

Я делал это раньше без элемента HTML5

4
ответ дан 23 November 2019 в 01:08
поделиться

Чтобы воспроизвести один и тот же сэмпл несколько раз, нельзя ли сделать что-то вроде этого:

e.pause(); // Perhaps optional
e.currentTime = 0;
e.play();

( e - это аудио element)

Возможно, я совершенно неправильно понял вашу проблему, вы хотите, чтобы звуковой эффект воспроизводился несколько раз одновременно? Тогда это совершенно неверно.

3
ответ дан 23 November 2019 в 01:08
поделиться

Взгляните на сайт jai (-> mirror ) (аудиоинтерфейс javascript). Глядя на их источник, кажется, что они постоянно вызывают play () и упоминают, что их библиотека может быть подходящей для использования в играх на основе HTML5.

Вы можете запускать несколько звуковых событий. одновременно, которые могут быть использованы для создания игр Javascript или иметь голос, говорящий поверх некоторых фоновая музыка

4
ответ дан 23 November 2019 в 01:08
поделиться
Другие вопросы по тегам:

Похожие вопросы: