HTML5音频正在缓冲吗？

Question

HTML5音频正在缓冲吗？

3

有没有办法判断一首歌曲是否正在缓冲？

当我点击播放并且歌曲开始播放时，事件会被触发，但是一旦歌曲开始播放后，如果数据传输不够快，它就会“暂停”，但不会触发任何事件。

我尝试过：

audioElement.addEventListener('suspend',function (){
    console.log('suspended'); //Fires the first time song is being "buffered"
});

audioElement.addEventListener('playing',function (){
    console.log('playing'); //Fires the first time the song is played.
});

我该如何检查数据是否正在缓冲，以便我可以通过某些指示告诉用户等待？

- Omar Mir

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- R Brill · Accepted Answer

这取决于您所针对的浏览器及其对当前W3C工作草案HTML5规范媒体元素部分的实现。您可以随时在此处检查您要针对的浏览器是否支持特定事件：http://www.w3.org/2010/05/video/mediaevents.html。否则，如果数据未传输，则我认为音频不会缓冲，而会触发“stalled”事件。如果数据正在传输，则您应该能够检查“suspend”或“progress”事件，这两个事件应该在数据被缓冲时（但不一定是暂停/播放）触发。如果这些事件没有触发，因为浏览器不支持它们，您可以使用计时器检查音频元素的“networkState”属性，这基本上告诉您音频是否正在缓冲：

<!DOCTYPE html>
<html>
    <body>
        <audio controls="controls" id="myAudio">
            <source src="http://www.w3schools.com/html5/horse.ogg" type="audio/ogg">
            Your browser does not support the audio element.
        </audio>
    </body>
</html>

Javascript:

var audioElement = document.getElementById('myAudio');

var checkNetworkStateTimer = setInterval(function () {
    console.log(audioElement.networkState); //2 indicates NETWORK_LOADING state
}, 250);

另外在jsFiddle上也有：http://jsfiddle.net/3sdhj/2/

你可能无法在jsFiddle中复制出networkState为2的情况，因为音频太短了，但你可以理解这个概念。

如果仍然失败，我建议使用流行的HTML5音频库，如SoundJS、Buzz或soundmanager2（我与这些库没有任何关联）。