javascript - 如何检查音频是否在缓冲？

我正在使用new Audio()创建我的音频元素，但是当添加事件侦听器'waiting'时，当我按play时它立即触发，而在开始缓冲时实际上并没有触发。

码：

var source = new Audio('some-url');

source.addEventListener('waiting', function () {
    alert('Buffering');
};

source.play()

因此'waiting'立即触发，但是在播放后音频开始缓冲时它不会再次触发，但是如果我搜索音轨（甚至在本地主机上），它也会触发ONCE。我怎样才能做到这一点？

最佳答案

根据Mozilla文档（https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events），您从waiting事件中看到的行为与预期的一样：


  等候
  
  当请求的操作（例如播放）被延迟以等待另一个操作（例如搜寻）完成时发送。


为了获得媒体下载的进度，您需要收听loadstart一次性事件或progress重复事件：


  加载开始
  
  在开始加载媒体时发送。
  
  进展
  
  定期发送以通知感兴趣的各方下载媒体的进度。媒体元素的buffered属性中提供了有关当前已下载媒体数量的信息。

var source = new Audio();

source.addEventListener('waiting', function () {
    window.alert('Waiting');
};

source.addEventListener('loadstart', function () {
    window.alert("Loading");
};

source.addEventListener('progress', function () {
    // do something, eg:
    var timeRanges = source.buffered;
    if (timeRanges && timeRanges.length > 0) {
        console.log(timeRanges);
        // do something with the TimeRanges object
    }
};

source.play()

关于javascript - 如何检查音频是否在缓冲？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35815423/