Dee*_*psy 11 javascript api html5 buffer microphone
我正在尝试构建一个实时语音呼叫应用程序.我的目标是使用本机JS麦克风api并通过websocket将数据发送到其他客户端.我想出了以下代码:
<script>
// Globals
var aCtx;
var analyser;
var microphone;
navigator.getUserMedia_ = ( navigator.getUserMedia
|| navigator.webkitGetUserMedia
|| navigator.mozGetUserMedia
|| navigator.msGetUserMedia);
if (navigator.getUserMedia_) {
navigator.getUserMedia_({audio: true}, function(stream) {
aCtx = new webkitAudioContext();
analyser = aCtx.createAnalyser();
microphone = aCtx.createMediaStreamSource(stream);
microphone.connect(analyser);
process();
});
};
function process(){
console.log(analyser);
setInterval(function(){
FFTData = new Float32Array(analyser.frequencyBinCount);
analyser.getFloatFrequencyData(FFTData);
console.log(FFTData); // display
},10);
}
</script>
Run Code Online (Sandbox Code Playgroud)
所以每隔10ms我就会得到缓冲区并通过节点发送.问题是我无法弄清楚如何播放缓冲区,我甚至不确定我是否以正确的方式获得缓冲区.我试过了:
var source = audioContext.createBufferSource();
var buffer; // the result printed in the code below
var audioBuffer = audioContext.createBuffer(1, buffer.length, 44100);
audioBuffer.getChannelData(0).set(buffer);
source.buffer = audioBuffer;
source.connect(audioContext.destination);
Run Code Online (Sandbox Code Playgroud)
我得到了缓冲区吗?我该怎么玩?
要发布缓冲区的回放,您必须在实例上调用start
方法AudioBufferSourceNode
。这里的问题是:您想播放音频流,而这AudioBuffer
不是为此设计的。如果您继续创建AudioBuffer
对象,用数据填充它们并将它们提供给您的AudioBufferSourceNode
实例,那么声音中肯定会有明显的停顿。
相反,您应该保留一个缓存缓冲区,在数据到达时立即填充它,并以正常速度清空它(不是立即,您必须等待足够的毫秒数的音频)。
最好的方法是使用提供的正确API:查看http://www.w3.org/TR/webaudio/#MediaStreamAudioDestinationNode-section和http://www.w3.org/TR/webaudio/ #MediaStreamAudioSourceNode-section。