我正在尝试构建一个简单的录音机，使用 WebRTC 和 MediaRecorder 同时(同步)录制和播放用户的声音。所以，这是我到目前为止所做的:
完整的 Html 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Audio Recorder</title>
<style>
audio{
display: block;
}
</style>
</head>
<body>
<audio id="audio" controls autoplay></audio>
<button type="button" onclick="mediaRecorder.start(1000)">Start</button>
<button type="button" onclick="mediaRecorder.stop()">Stop</button>
<script type="text/javascript">
var mediaRecorder = null,
chunks = [],
audio = document.getElementById('audio');
function onSuccess( stream ) {
mediaRecorder = new MediaRecorder( stream );
audio.srcObject = stream ;
mediaRecorder.ondataavailable = function( event ) {
chunks.push( event.data );
}
}
var onError = function(err) {
console.log('Error: ' + err);
}
navigator.mediaDevices.getUserMedia({ audio: true }).then(onSuccess, onError);
</script>
</body>
</html>
这段代码的问题在于，它播放了整个流，而我想要的只是录制的部分(由 MediaRecorder 录制的音频)。
问题:这是可能的还是唯一的选择是停止记录器然后获取记录的部分(代码中的“ block ”)？
Note: A yes/no answer would be more than enough for me. Thanks.
代码解释:
当您运行代码时，您的浏览器会询问您是否允许访问您的麦克风:
如果你点击允许，即使你没有点击开始按钮，你也会听到你的声音，这是因为音频元素的源设置为整个流。
我想要的是只听到录制的部分，在录制时(点击开始按钮)，换句话说，将录制的部分转换为流。
我在找什么:
最佳答案
只需从您的音频元素中删除autoplay，然后执行
mediaRecorder.start(1000);
audio.play();
和
mediaRecorder.stop();
audio.pause();
然后麦克风的音频将仅在录制期间可听到。
您不需要将录制的部分转换为流。如果这样做，只会引入延迟。
OTOH，如果您正在尝试回放您已经录制的内容，请参阅 my answer to another question .
关于javascript - MediaRecorder - 是否可以同时录制和播放？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50188867/