我用navigator.mediaDevices.getUserMedia()捕获用户的音频和视频，然后使用MediaRecorder及其ondataavailable将该视频和音频blob存储在本地以便稍后上传。
现在我正在处理一个问题，由于某种原因，ondataavailable在录制中途停止被调用。我不知道为什么，也没有收到任何出错的提醒。首先，有人知道为什么会发生这种情况以及如何捕获错误吗?
第二，我试着复制。通过这样做。
navigator.mediaDevices.getUserMedia({ audio: true, video: true })
.then(function(camera) {
local_media_stream = camera;
camera.getVideoTracks()[0].onended = function() { console.log("VIDEO ENDED") }
camera.getAudioTracks()[0].onended = function() { console.log("Audio ENDED") }
camera.onended = function() { console.log("--- ENDED") }
camera.onremovetrack = (event) => { console.log(`${event.track.kind} track removed`); };
}).catch(function(error) {
alert('Unable to capture your camera. Please check logs.' + error);
console.error(error);
});
用
记录流recorder = new MediaRecorder(local_media_stream, {
mimeType: encoding_options,
audioBitsPerSecond: 128000,
videoBitsPerSecond: bits_per_second,
});
recorder.ondataavailable = function(e) {
save_blob(e.data, blob_index)
blob_index++;
}
recorder.onstop = function(e) {
console.log("recorder stopped");
console.log(e)
}
recorder.onerror = function(error) {
console.log("recorder error");
alert(error)
throw error;
}
recorder.onstart = function() {
console.log('started');
};
recorder.onpause = function() {
console.log('paused');
};
recorder.onresume = function() {
console.log('resumed');
};
recorder.start(15000)
然后我尝试手动终止流，希望通过执行
来重现发生的任何问题local_media_stream.getVideoTracks()[0].stop()
现在ondataavailable不再被调用，但没有一个onended事件被调用。录音仍在进行，local_media_stream仍处于活动状态。
如果我也杀死音频
local_media_stream.getAudioTracks()[0].stop()
现在local_media_stream不活动，但仍然没有事件被调用，告诉我流停止了，记录器仍在运行，但ondatavailable从未被调用。
我能做什么?我想知道本地流是否被成功录制，如果没有被警告，那么我至少可以通知用户录制不再保存。
MediaRecorder有一个recorder.stop()方法。我没有看到你在示例代码中调用它。
当你在你的媒体流轨道上调用track[n].stop()时，你告诉他们停止向MediaRecorder提供数据。因此，不出所料，MediaRecorder停止生成其编码输出流。
你也可以，如果你在谷歌浏览器上运行，尝试比你的recorder.start(15000)更短的时间片。或者通过使用recorder.requestData()来强制交付dataavailable事件。
编辑当您调用. requestdata()时，它调用ondataavailable事件处理程序。(而且，如果您在.start()调用中指定了一个时间片，则会自动调用处理程序。)对该处理程序的每次调用都传递自上次调用以来的编码媒体数据。如果需要整个数据流，可以在处理程序中累积它。但是当你这样做的时候，当然，它需要进入浏览器的RAM堆，所以你不能只是无限期地积累它。
停止两个轨道应该停止你的录音机，它为我在FF和Chrome: https://jsfiddle.net/gpt51d6y/
但是你的用户不太可能自己调用stop()。
最有可能的问题不是在MediaRecorder，但在此之前在MediaStream的轨道。
如果MediaRecorder的所有音轨都是静音的，那么它不会发出新的数据可用事件，因为从它的角度来看，仍然有一些事情可能正在进行，音轨可能随时取消静音。
想象一个带有硬件一键说话功能的麦克风，每次用户释放这样的按钮时，这个麦克风的音轨都会静音，但是MediaRecorder，即使它在这段时间内不会录制任何内容，仍然需要增加其内部计时，以便"间隙";不要被"粘"住。在最后的介质中。然而，由于没有任何东西传递给它的图，它既不会发出新的数据可用事件，它只会在将要发出的下一个块中调整时间戳。
对于您试图找到问题的来源的情况，您可以尝试侦听MediaRecorder的错误事件，它可能在某些情况下触发。
但是你也应该给它的流的每个轨道添加事件，并且不要忘记静音事件:
recorder.stream.getTracks().forEach( (track) => {
track.onmute = track.onended = console.warn;
};