时间戳

首页 > 解决方案 > AudioWorklet 中的 new Function()

javascript - AudioWorklet 中的 new Function()

问题描述

我想创建一个音频编辑器，您可以在其中将节点连接在一起以创建自定义音频组件。每次节点更改时，它们都会被编译成 javascript，然后由 a 运行new Function()以获得更好的性能。我刚刚读到有可能创建一个AudioWorklet在单独的线程上运行的 . 现在我想知道是否有可能将这两种想法结合起来，将我的算法AudioWorklet作为一串javascript代码传递给，然后使用new Function(codeString)构造函数内部将其放入函数中。然后 audioworklet 的process()函数将以某种方式调用自定义函数。

这在某种程度上是可能的，还是我要求太多？在我花费数小时试图让它工作之前，我想得到一个“是的，这是可能的”或“不，抱歉”......

谢谢你的帮助，

狗年

标签： javascriptweb-audio-apiaudio-worklet

解决方案

在@AKX 的评论的帮助下，我一起制作了这个解决方案。字符串中的代码稍后将被编译器替换。



function generateProcessor()
{
    return (`

class TestProcessor extends AudioWorkletProcessor 
{
    process(inputs, outputs) 
    {
        const input = inputs[0];
        const output = outputs[0];

        for (let channel = 0; channel < output.length; ++channel) {
            for (let i = 0; i < output[channel].length; i++) {
                output[channel][i] = 0.01 * Math.acos(input[channel][i]);
            }
        }

        return true;
    }
}

registerProcessor('test-processor', TestProcessor);

`);
}

const button = document.querySelector('#button');

button.addEventListener('click', async (e) =>
{
    const audioContext = new AudioContext();

    await audioContext.audioWorklet.addModule(
        URL.createObjectURL(new Blob([
            generateProcessor()
        ], {type: "application/javascript"})));

    const oscillator = new OscillatorNode(audioContext);

    const testProcessor = new AudioWorkletNode(audioContext, 'test-processor');

    oscillator.connect(testProcessor).connect(audioContext.destination);

    oscillator.start();
});

推荐阅读