Web Audio API:将mp3声音流合并到一个文件并在<audio>标签</audio>中播放

时间:2015-02-07 11:02:32

标签: html5 audio html5-audio web-audio

我做了一些关于从远程服务器流式播放mp3文件并将其作为一个播放的研究,但因为我对Web Audio API完全不熟悉,我有点困惑。

我所拥有的是存储在另一台服务器上的5个MP3文件的路径。它们的长度大约是10分钟,因此文件大小“很大”。 我想要下载第一个,开始播放,播放时我想继续下载其他文件。

我已经读过我需要为每个文件创建一个XMLHttpRequest并将其作为“arraybuffer”。然后我需要做的是解码arraybuffer。 解码它意味着什么?

让我们说arraybuffer已解码,我如何在html5标签中播放? 我如何继续执行XMLHttpRequests并将它们添加到已经播放的第一个文件的arraybuffer中?

编辑:我忘了提到我不想每次新的声音文件开始播放时重启进度条...我希望它显示从第一个声音文件到最后一个声音文件的持续时间之一。

1 个答案:

答案 0 :(得分:2)

如果您要做的就是端到端播放文件,我认为您尝试这样做的方式是过度的。如果你正在使用Web Audio API,XMLHttpRequest和解码缓冲区就是这样做的方法,但是如果没有它,你应该能够做到这一点。只需在HTML中添加标签:

<audio src="1.mp3" autoplay></audio>
<audio src="2.mp3" preload="auto"></audio>
<audio src="3.mp3" preload="auto"></audio>
<audio src="4.mp3" preload="auto"></audio>
<audio src="5.mp3" preload="auto"></audio>

所以当然第一个将开始独立播放(除了可能在iOS上,我认为原则上不支持自动播放)。然后,您的JavaScript可以侦听每个音频元素上的事件,然后在适当的时间开始播放下一个音频元素。举办活动是值得倾听的活动。