----- 下面已添加更新 -----
我在使用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) {
// 从 `e.data` 读取blob,解码64并发送到服务器;
}
recorder.start(1000)
})
问题在于当我连接所有部分时得到的WebM文件会损坏(很少出现)!我可以将其作为WebM播放,但当我尝试将其转换(使用ffmpeg)为其他格式时,会得到一个时间轴偏移的文件。
例如。我正在尝试将持续时间为00:36:27.78
的文件转换为wav,但我得到的文件持续时间为00:36:26.04
,少了1.74秒。
在文件开头-音频相同,但是大约10分钟后,WebM文件将出现小延迟。
经过一些研究,我发现它在与浏览器的MediaSource API(我用于播放块的API)不兼容。我尝试了两种播放这些块的方式: 1. 将所有部分合并为单个 blob - 它运行正常。 2. 通过sourceBuffer对象添加它们时,会出现一些间隙(我可以通过检查“buffered”属性来看到它们)。 - 697.196 - 697.528 (~330 毫秒) - 996.198 - 996.754 (~550 毫秒) - 1597.16 - 1597.531 (~370 毫秒) - 1896.893 - 1897.183 (~290 毫秒)这些间隙总共有1.55秒,在wav和webm文件之间的不同步开始的地方恰好出现。不幸的是,能够重现此问题的文件无法共享,因为它是客户的私人数据,并且我尚未能在其他媒体上复制此问题。
这种问题的原因是什么?
----- 更新 ----- 我能够在https://jsfiddle.net/96uj34nf/4/上复现该问题。
要查看问题,请单击“打印缓冲区域”按钮,它将显示时间范围。您可以看到有两个间隙: 1. 136.349 - 141.388 2. 195.439 - 197.57
因此,您可以看到存在5秒和2秒的间隔。如果有人能够解释为什么会发生这种情况或如何避免这个问题,我会很高兴。
谢谢