更新(可重现)-使用MediaRecorderAPI录制时的间隙(音频/webmopus)

-----更新已添加到以下-----

我有MediaRecorder API的问题(https://www.w3.org/TR/mediastream-recording/#mediarecorder-api).

我正在使用它来记录网页上的语音(在这种情况下使用Chrome)并将其保存为块.我需要能够在录制时播放它,所以保留这些块是很重要的.

这是记录数据的代码:

navigator.mediaDevices.getUserMedia({ audio: true, video: false }).then(function(stream) { recorder = new MediaRecorder(stream, { mimeType: 'audio/webm; codecs="opus"' }) recorder.Ondataavailable= function(e) { // Read blob from `e.data`, decode64 and send to sever; } recorder.start(1000) })

问题是我连接所有部分时得到的WebM文件已损坏(很少)!我可以将它作为WebM播放,但是当我尝试将它(ffmpeg)转换为其他内容时,它会给我一个时间偏移的文件.

例如.我正在尝试将具有持续时间的文件转换00:36:27.78为wav,但是我得到一个持续时间00:36:26.04为1.74s 的文件.

在文件的开头 - 音频是相同的,但在大约10分钟后,WebM文件播放的延迟很小.

经过一些研究,我发现它也无法正常使用浏览器的MediaSource API,我用它来播放这些块.我尝试了两种方式来玩这些块:

在我将所有部件合并为一个blob的情况下 - 它工作正常.如果我通过sourceBuffer对象添加它们,它有一些空白(我可以通过检查buffered属性看到它们).697.196 - 697.528(~330ms)996.198 - 996.754(~550ms)1597.16 - 1597.531(~370ms)1896.893 - 1897.183(~290ms)

这些差距总共是1.55秒,它们恰好位于wav和webm文件之间的异步开始的地方.遗憾的是,无法共享可重现的文件,因为它是客户的私人数据,而我无法在不同媒体上重现此类问题.

造成这种问题的原因是什么？

-----更新-----我能够在https://jsfiddle.net/96uj34nf/4/上重现这个问题

要查看问题,请单击"打印缓冲区"按钮,它将显示时间范围.你可以看到有两个差距:0 - 136.349,141.388 - 195.439,197.57 - 198.589

136.349 - 141.388

195.439 - 197.57

所以,你可以看到有5秒和2秒的差距.如果有人能够阐明它为什么会发生或如何避免这个问题,那将会很高兴.

谢谢