播放无延迟的声音数组

Question

我已经创建了一个音频数组，每个音频是.wav文件路径的字符串。我正在尝试播放声音，但我听到每个文件播放之间的短暂延迟。下面是我的代码:

<script th:inline="javascript">
var sounds = [];
var i = -1;
/*<![CDATA[*/
/*[# th:each="chord : ${chords}"]*/
sounds.push(new Audio(/*[[${chord.audio}]]*/))
/*[/]*/
/*]]>*/
function playSnd() {
i++;
if (i == sounds.length) {
i = -1;
return;
}
sounds[i].addEventListener('ended', playSnd);
sounds[i].play();
}
function addSound(clicked_id) {
sounds.push(new Audio(clicked_id));
}
</script> 

我的问题:有没有更好的方法来处理音频文件，并消除每个音频之间的几毫秒延迟?

Answer 1

除了转换为mp3之外，您还可以预加载音频文件，并且只在它们全部加载后播放它们。oncanplaythrough方法可以帮助解决这个问题。https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/oncanplaythrough

Answer 2

就像Zer00ne说的，把wav格式转换成mp3格式，使文件更小。

但是，如果不能这样做，您也可以使用方法timeupdate(e)。它会在播放时持续开火。在结束前一秒开始下一个曲目:

免责声明:还没有测试过下面的代码

sounds[i].addEventListener('timeupdate', (e) => {
if (!e.target.nextTrackStarted) {
if ((e.target.duration - e.target.currentTime) < 2) {
e.target.nextTrackStarted = true;
playSnd();
}
}
});