Временные проблемы с воспроизведением HTML5 Audio API - PullRequest
Новая
       0

Временные проблемы с воспроизведением HTML5 Audio API

1 голос
/ 22 ноября 2011

Я использую следующий код для воспроизведения аудиоклипа с помощью HTML5 Audio API: 

HTMLAudioElement.prototype.playClip  = function(startTime, stopTime) { 
  this.stopTime = stopTime;
  this.currentTime = startTime;
  this.play();
  $(this).bind('timeupdate', function(){
    if (this.ended || this.currentTime >= stopTime) {
      this.pause();
      $(this).unbind('timeupdate');
    }
  });

}

Я использую этот новый метод playClip следующим образом.Сначала у меня есть ссылка с некоторыми атрибутами data: 

<a href=# data-stop=1.051 data-start=0.000>And then I was thinking,</a>

И, наконец, этот бит jQuery, который работает на $(document).ready, чтобы подключить клик по ссылке с воспроизведением: $ ('a') .click (function (ev) {

  $('a').click(function(ev){

    var start = $(this).data('start'),
        stop = $(this).data('stop'),
        audio = $('audio').get(0),
        $audio = $(audio);

    ev.preventDefault();

    audio.playClip(start,stop);


  })

Этот подход, похоже, работает, но есть неприятная ошибка: иногда воспроизведение данного клипа воспроизводится с превышением правильного data-stop времени.

Я подозреваю, что это может быть как-то связано со временем события timeupdate, но я не гуру JS и не знаю, как начать отладку проблемы. Вот несколько подсказок, которые я собрал:

  • Похоже, что такое поведение наблюдается и в FF, и в Chrome.
  • Воспроизведение данного клипа на самом деле, кажется, немного меняется - если я играю один и тот же клип,пару раз подряд он может переигрывать разное количество времени при каждом воспроизведении.

В чем проблема, связанная с точностью API аудио? Моему приложению нужны миллисекунды.

Есть ли проблема с тем, как я использую jQuery для привязки и отмены привязки?он timeupdate событие?Я попытался использовать подход без jQuery с addEventListener, но не смог заставить его работать.

Заранее спасибо, я действительно хотел бы знать, что происходит не так.

1 Ответ

1 голос
/ 22 ноября 2011

Событие timeupdate происходит только 3-4 раза в секунду или около того, с точностью до миллисекунды.Опять же, это лучше, чем setTimeout / setInterval, который срабатывает только один раз в секунду, если вкладка не активна в Google Chrome (распространенный вариант использования для прослушивания аудио-файлов).может гарантировать, что вкладка активна во время прослушивания, тогда setTimeout или setInterval лучше, так как она может срабатывать так часто, как 100 раз в секунду.

...