如何播放部分音频文件？

How would I play an audio file in javascript that has been spliced into two byte arrays and loaded separately from a server at different times? I want to load the first half of an mp3 file, then, while the mp3 is playing, load the second half and seamlessly continue playing through the whole file.

如何在javascript中播放音频文件,该文件已拼接成两个字节数组并在不同时间与服务器分开加载?我想加载mp3文件的前半部分,然后,当mp3播放时,加载后半部分并无缝地继续播放整个文件。

2 个解决方案

#1

You can use the canplaythrough and ended events to, play the first audio while loading the second, then play the second after loading. Something like this:

您可以使用canplaythrough和结束事件,在加载第二个音频时播放第一个音频,然后在加载后播放第二个音频。像这样的东西:

var canPlayAudio2 = false;
var audio1Ended = false;

var audio = document.createElement('audio');
audio.src = "your_audio_source";
audio.addEventListener('canplaythrough', function() {
  //after first audio loads, start loading second audio
  var audio2 = document.createElement('audio');
  audio2.src = "your_audio2_source";
  audio2.addEventListener('canplaythrough', function() {
    canPlayAudio2 = true;
    if (audio1Ended) {
      audio2.play();
    }
  });

  //play the first audio, play second audio if availible once finished
  audio.play();
  audio.addEventListener('ended', function() {
    audio1Ended = true;
    if (canPlayAudio2) {
      audio2.play();
    }
  });

});

#2

While the first part is playing, create another audio tag to pre-load the second half, but do not play it.

第一部分正在播放时,创建另一个音频标签以预加载后半部分,但不播放它。

<audio src="the second half.mp3” preload="auto"></audio>

When the first audio trigger the ended event, change its URL to the second half.

当第一个音频触发结束事件时,将其URL更改为下半部分。

The browser will get the file from cache and starts to play it immediately.

浏览器将从缓存中获取文件并立即开始播放。

Sorry for my poor English, hoping this helps.

抱歉我的英语不好,希望这会有所帮助。

#1