我目前正在使用 HTML5/JS 开发一个音乐应用程序,并试图通过 MediaStream Recording API 实现最低的延迟。该应用程序允许用户使用相机和麦克风录制音乐。当摄像头和麦克风打开时,代码将允许用户听到和看到自己。
目前我有:
const stream = await navigator.mediaDevices.getUserMedia(
{
video: true,
audio: {
latency: {exact: 0.003},
}
}
);
// monitor video and audio (i.e. show it to the user)
this.video.srcObject = stream;
this.video.play();
如果我降低延迟要求,我会收到 OverConstrained 错误。延迟还可以(比默认值好),但对于在录音时听到自己的声音来说仍然不是很好。当您弹奏吉他并在耳机中听到时,会有轻微的、可察觉的延迟。
我可以在这里进行其他优化以获得更好的结果吗?我不太在意视频和音频的质量,所以也许降低分辨率、采样率等对此有帮助?
最佳答案
0.003 的延迟是非常非常低的延迟(3 毫秒),人耳察觉不到。
也就是说,当我们谈论数字音频时,延迟不能为 0。 尽管您设置了一个非常低的值,但由于各种原因不能保证延迟实际匹配,如果系统无法匹配延迟, promise 将被拒绝。
如您所见here在文档中:
Constraints which are specified using any or all of max, min, or exact are always treated as mandatory. If any constraint which uses one or more of those can't be met when calling applyConstraints(), the promise will be rejected.
注意:不同的浏览器和不同的操作系统表现不同。
Chrome
Chrome,在某些方面canary build引入了一个低延迟特性,称为 实时网络音频输入:
// success callback when requesting audio input stream
function gotStream(stream) {
window.AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContext();
// Create an AudioNode from the stream.
var mediaStreamSource = audioContext.createMediaStreamSource( stream );
// Connect it to the destination to hear yourself (or any other node for processing!)
mediaStreamSource.connect( audioContext.destination );
}
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia( {audio:true}, gotStream );
在这里您可以看到一些利用该功能的演示:
关于javascript - 使用 MediaStream Recording API 进行最低延迟音频播放/监控的一组好的约束是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57579774/