不要在 Android 上加载时间流音频

Question

我想在来自电台的网络音频流上播放它。按 loadstart 事件消息播放时出现 LOADING 但在开始播放音频流之前被删除，大约提前 4 或 5 秒。我希望事件能够控制加载流文件的时间。

台式电脑不存在问题，因为音频会立即加载，但在智能手机中的 Chrome 浏览器和 S.O. Android 这个问题非常明显，加载大约需要 6 或 7 秒。所以我会通过一些事件来控制这个时间。

什么类型的事件可以用于消息 LOADING 直到音频没有开始播放才被删除？谢谢。

 function AudioStart(){
    audio = new Audio();
  audio.src = "http://listen.XXXX.com/XXXX";

    audio.addEventListener("loadstart", function(){

document.getElementById('title').innerHTML="<span>LOADING...</span>";

;
},false);


audio.addEventListener("loadeddata", function(){

audio.play();

},false);



} 

Answer 1

如果您想确保加载整个音频，请收听 oncanplay 而不是 loadeddata 或 oncanplaythrough。

loadeddata 事件在加载当前帧的数据时发生，但没有足够的数据来播放指定音频/视频的下一帧。

canplay 事件发生在浏览器可以开始播放指定的音频/视频时（当它已经缓冲到足以开始播放时）

canplaythrough 事件发生在浏览器估计它可以播放指定的音频/视频而无需停止缓冲时。

试试这个：

function AudioStart() {
  audio = new Audio();
  audio.src = "http://www.w3schools.com/html/horse.mp3";

  audio.addEventListener("loadstart", function() {
    document.getElementById('title').innerHTML = "<span>LOADING...</span>";
  }, false);

  audio.addEventListener("canplay", function() { //OR 'oncanplaythrough'
    document.getElementById('title').innerHTML = "";
    audio.play();
  }, false);
}

<h3 id='title'></h3>
<button onclick='AudioStart()'>Start Audio</button>

Fiddle here