有没有办法播放在html5中同步的多个音频文件?

时间:2019-06-04 08:29:45

标签: html html5-audio web-audio web-audio-api

我们在会议室进行录音,我们在那里进行多次演讲者交谈。每个扬声器都配有一个个人麦克风,每个麦克风的语音都记录为一个单独的通道(独立的音频文件)。

我们的目标是允许用户一次播放所有音频(频道)。我们可能有多达12个单独的文件。 此外,我们需要用户能够控制每个流的音量(因此仅在后端合并文件不是解决方案)。

我们可以用什么来实现这一目标?一次播放所有内容的幼稚解决方案可能行不通,因此我们想知道现代html5 API是否解决了这种挑战。

---更新以回答@Amdadan的评论---

  

为什么不呢?你尝试了吗?您是否担心连接吞吐量,如果   你在流媒体吗?您担心API限制吗?

是的,我们尝试过。 1)当我们在所有文件上调用“播放”时-并非同时启动所有文件(它开始全部加载,一次加载较快,一个加载较慢等)。 2)当它已经在播放并且文件到达“缓冲”时间的末尾时-当其他文件继续播放时,它也会停止。

我们尝试使用事件来处理这些案件,但我们没有成功-有很多案件要处理。

  

您是否担心大小,如果在播放之前将它们全部加载?

是的,我们是。文件可能长达几个小时-不能全部缓冲。

  

您是否担心连接吞吐量(如果正在流式传输)   他们?您担心API限制吗?

否,我们使用连接到s3的CloudFront-吞吐量还可以,并且没有特定限制


预先感谢您,  -杰克

2 个答案:

答案 0 :(得分:0)

无论选择哪种方式,请确保音轨之间的延迟为0ms,因为这可能会造成相位问题和梳状滤波。 (对于非音频专家,这些问题听起来真的很糟糕)

WebM似乎正在使用支持多轨的Matroska。详细信息请参见下面的链接。

Multi Track Audio (and Video) HTML5

还要检查一下支持多轨播放的Howler.js,我认为它最适合您的需求。

Howler.js on GitHub

答案 1 :(得分:0)

也许您可以选择使用MediaSync library。它允许您同步两个<video/>元素,如其页面所示。但这也应该适用于音频。