使用MediaStream Recording API和MediaDevices.getUserMedia()方法，您可以从麦克风流式传输音频，并将其流式传输到录音机中，然后每当ondataavailable事件在录音机上触发时，录音机可以通过WebSockets发送Blob对象。
下面的函数创建一个流并将其传递给MediaRecorder示例。该示例将录制您的麦克风音频并能够将其发送到您的WebSocket。MediaRecorder的示例被返回以控制录制器。

async function streamMicrophoneAudioToSocket(ws) {
  let stream;
  const constraints = { video: false, audio: true };

  try {
    stream = await navigator.mediaDevices.getUserMedia(constraints);
  } catch (error) {
    throw new Error(`
      MediaDevices.getUserMedia() threw an error. 
      Stream did not open.
      ${error.name} - 
      ${error.message}
    `);
  }

  const recorder = new MediaRecorder(stream);

  recorder.addEventListener('dataavailable', ({ data }) => {
    ws.send(data);
  });

  recorder.start();
  return recorder;
});

这样，如果您愿意，还可以通过调用记录器上的stop()方法来停止记录。

(async () => {
  const ws = new WebSocket('ws://yoururl.com');
  const recorder = await streamMicrophoneAudioToSocket(ws);

  document.addEventListener('click', event => {
    recorder.stop();
  });
}());

• • 旁注**：虽然我之前的回答确实对一些人有所帮助，但它并没有提供deprecated onaudioprocess event and ScriptProcessorNode Interface的替代方案。这个答案应该为OP的问题提供一个替代方案。

答案应该是使用Audio Worklets，使我们能够创建 * 自定义音频处理节点 *，可以像常规AudioNode一样实现。
Web音频API的AudioWorkletNode接口表示用户定义的AudioNode的基类，它可以与其他节点一起连接到音频路由图。它具有关联的AudioWorkletProcessor，该处理器在Web音频呈现线程中执行实际的音频处理。
它通过扩展AudioWorkletProcessor类并提供强制的process方法来工作，process方法公开在静态parameterDescriptors getter中设置的inputs、outputs和parameters。
在这里你可以插入与onaudioprocess回调相同的逻辑，但是你必须做一些修改才能正常工作。
使用worklet的一个陷阱是，您已经将此脚本作为一个文件从worklet界面中包含进来。这意味着任何依赖项，如ws变量，都需要在稍后阶段注入。我们可以扩展该类，以向worklet示例添加任何值或依赖项。

• • 注意：**process需要返回一个布尔值，让浏览器知道音频节点是否应该保持活动状态。

registerProcessor('buffer-detector', class extends AudioWorkletProcessor {
  process (inputs, outputs, parameters) {
    if (this.#socket === null) {
      return false;
    }

    if (this.#isRecording === true) {
      const [input] = inputs;
      const buffer = new ArrayBuffer(input.length * 2);
      const output = new DataView(buffer);

      for (let i = 0, offset = 0; i < input.length; i++, offset += 2) {
        const s = Math.max(-1, Math.min(1, input[i]));
        output.setInt16(offset, s < 0 ? s * 0x8000 : s * 0x7fff, true);
      }

      this.#socket.send(buffer);
    }

    return true;
  }

  static get parameterDescriptors() {
    return [{
      name: 'Buffer Detector',
    }]
  }

  #socket = null;
  #isRecording = false;

  constructor() {
    super();
  }

  get socket() {
    return this.#socket;
  }

  set socket(value) {
    if (value instanceof WebSocket) {
      this.#socket = value;
    }
  }

  get recording() {
    return this.#isRecording;
  }

  set recording(value) {
    if ('boolean' === typeof value) {
      this.#isRecording = value;
    }
  }
});

现在我们要做的就是在脚本中包含worklet并创建一个节点示例，我们可以使用BaseAudioContext.audioWorklet属性中的addModule方法来完成。

• 重要提示：* 添加模块仅在安全（HTTPS）上下文中有效。

成功添加模块后，使用AudioWorkletNode构造函数创建新节点，分配WebSocket示例，设置记录标志，然后就可以开始了。

const ws = new WebSocket('ws://...');
const audioContext = new AudioContext();
const source = new MediaStreamAudioSourceNode(audioContext, {
  mediaStream: stream // Your stream here.
});

(async () => {
  try {
    // Register the worklet.
    await audioContext.audioWorklet.addModule('buffer-detector.js');

    // Create our custom node.
    const bufferDetectorNode = new AudioWorkletNode(audioContext, 'buffer-detector');

    // Assign the socket and the recording state.
    bufferDetectorNode.socket = ws;
    bufferDetectorNode.recording = true;

    // Connect the node.
    source.connect(bufferDetectorNode);
  } catch (error) {
    console.error(error);
  }
})();