Я создаю потоковое веб-приложение html5. Этот вопрос относится к аудио части проекта, но я уверен, что столкнусь с подобной ситуацией, когда начну работу с видео частью. Мое целевое устройство - браузер для сафари на iPad (поэтому я должен сделать это html5). Воспроизведение работает нормально, но у меня есть полоса загрузки, которая должна отражать, сколько трека было загружено. Следуя спецификации w3, я попытался реализовать это следующим образом, используя jQuery:
var that = this;
that.player = $('audio')[0];
$('that.player').bind('progress',function(){
var buffer = that.player.buffered.end(0)
that.updateLoadBuffer(buffer);
});
Это не сработало. «that.player.buffered» возвращает объект TimeRanges, а у TimeRanges есть метод «end (index)», который возвращает позицию воспроизведения конца буфера в секундах для TimeRange, указанного в «index». TimeRanges также имеют свойство .length, которое сообщает вам, сколько TimeRanges инкапсулировано объектом. Когда я попытался зарегистрировать это свойство, я обнаружил, что TimeRanges.length = 0, что означает, что TimeRanges не передаются обратно. Также, когда я бросил операторы регистрации в связанную функцию, я обнаружил, что событие «progress» никогда не запускалось. У меня есть отдельные функции для событий «loadedmetata »и« timeupdate », которые следуют аналогичному формату, и они запускаются, как и ожидалось. Я попробовал другие методы для захвата событий безрезультатно:
that.player.onprogress = function(e){
console.log('progressEvent heard');
};
that.player.addEventListener('progress',progressHandler, false)
function progressHandler(e){
console.log('progressEvent heard');
};
Ни один из них не вызвал мое консольное сообщение. Моя аудио-декларация выглядит следующим образом:
<audio style="width:0;height:0;"></audio>
что я тут не так делаю?
ОБНОВЛЕНИЕ: я использую wowzamediaserver для обработки потокового http. Я не знаю, может ли это иметь какое-либо отношение к этому.
ДАЙТЕ ДРУГОЕ ОБНОВЛЕНИЕ: я понимаю, что у меня нет источника в моем аудио-тэге, потому что я установил его динамически, используя jquery, следующим образом:
$('audio').attr('src','http://my.wowza.server:1935/myStreamingApp/_definst_/mp3:path/to/my/track/audio.mp3/playlist.m3u8');
опять же, у меня нет проблем с воспроизведением, так что это не должно иметь никакого отношения к моей проблеме, но я просто хочу дать вам, ребята, как можно более четкое изображение.