用 AudioWorklet 替换 scriptProcessorNode

Question

我正在记录用户的麦克风输入并进行处理。问题是我正在使用 scriptProcessorNode 来处理数据，但是 Google 中的 here it said that is has been deprecated and replaced with AudioWorklet.The problem is that there is no clear way to replace this functionality with AudioWorklet, and from all of the example projects with AudioWorklets、none 正在对麦克风输入做任何事情。有没有办法用 Audio Worklet 替换此代码？这是 "should" 被替换的代码。

    // Connect analyser
    this.options.source.connect(this.analyser);
    // Create ScriptProcessorNode
    this.scriptProcessorNode = this.options.context.createScriptProcessor(this.options.bufferLen, numChannels, numChannels);
    // Connect scriptProcessorNode (Theretically, not required)
    this.scriptProcessorNode.connect(this.options.context.destination);
    // Create callback to update/analyze floatFrequencyData
    var self = this;
    this.scriptProcessorNode.onaudioprocess = function (event) {
        self.analyser.getFloatFrequencyData(self.floatFrequencyData);
        self.update();
        self.store(event);
        self.monitor();
    };
    // Connect scriptProcessorNode
    this.options.source.connect(this.scriptProcessorNode);

Answer 1

我有一个创建 AudioWorkletProcessor 的简单示例。你可以检查一下here。它仅适用于 Chromium，Firefox 尚不支持 AudioWorklet。

这是我准备显示我遇到的 webpack 错误的示例，因此请仅检查源代码。如果您运行项目将失败，除非您注释 audio-meter.js 第 8 行并取消注释第 11 行。文件 audio-meter.worker.js 被复制，内容相同。

用 AudioWorklet 替换 scriptProcessorNode

Replacing scriptProcessorNode with AudioWorklet

audio-recording

web-audio-api

voice-recording