使用navigator.mediaDevices.getUserMedia录制浏览器音频

时间:2018-02-03 16:27:34

标签: javascript html5 angular getusermedia

我正在录制麦克风的浏览器音频输入,并通过websocket发送到nodeJs服务,该服务将流写入.wav文件。

我的问题是第一次录音很好,但是任何后续录音听起来都很慢,大约是速度的一半,因此无法使用。

如果我刷新浏览器,第一次录制再次起作用,后续录制速度变慢,这就是为什么我确定问题不在nodeJs服务中。

我的项目是一个Angular 5项目。

我已经粘贴了我正在尝试的代码。

我正在使用binary.js - >     https://cdn.jsdelivr.net/binaryjs/0.2.1/binary.min.js

this.client = BinaryClient(`ws://localhost:9001`)

createStream() {
    window.Stream = this.client.createStream();

    window.navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
      this.success(stream);
    })
}

stopRecording() {
    this.recording = false;
    this.win.Stream.end();
}



success(e) {
    var audioContext = window.AudioContext || window.webkitAudioContext;
    var context = new audioContext();

    // the sample rate is in context.sampleRate
    var audioInput = context.createMediaStreamSource(e);

    var bufferSize = 2048;
    var recorder = context.createScriptProcessor(bufferSize, 1, 1);
}

recorder.onaudioprocess = (e) => {
  if (!this.recording) return;
  console.log('recording');
  var left = e.inputBuffer.getChannelData(0);
  this.win.Stream.write(this.convertoFloat32ToInt16(left));
}

audioInput.connect(recorder)
    recorder.connect(context.destination);
}

convertoFloat32ToInt16(buffer) {
    var l = buffer.length;
    var buf = new Int16Array(l)

    while (l--) {
      buf[l] = buffer[l] * 0xFFFF;    //convert to 16 bit
    }
    return buf.buffer
}

我对可能出现的问题感到难过,所以如果有人有使用此浏览器技术的经验,我将不胜感激。

感谢。

1 个答案:

答案 0 :(得分:0)

我遇到了这个问题 - 你的问题是采样率你写的WAV文件不正确。

您需要将浏览器和麦克风使用的采样率传递给写入二进制WAV文件的node.js。

客户端:

成功完成navigator.mediaDevices.getUserMedia(在您的情况下为success函数)后,从sampleRate元素中获取AudioContext变量:

var _smapleRate = context.sampleRate;

然后将其作为参数传递给node.js侦听器。就我而言,我用过:

binaryClient.createStream({ SampleRate: _smapleRate });

服务器(Node.js)方:

使用传递的SampleRate设置WAV文件的采样率。在我的例子中,这是代码:

fileWriter = new wav.FileWriter(wavPath, {
                channels: 1,
                sampleRate: meta.SampleRate,
                bitDepth: 16
             });

这样可以防止破音,低音,低音或快速WAV文件。

希望这有帮助。