AudioWorklet 错误:DOMException:用户中止请求 [英] AudioWorklet error: DOMException: The user aborted a request

问题描述

我已经在 React 中成功实例化了一个简单的 AudioWorklet，并希望像 Google 的示例中那样启动一个简单的振荡器.为了测试运行它，我正在渲染一个按钮，其 onClick 事件调用以下内容:

I've successfully instantiated a simple AudioWorklet in React and wish to start a simple oscillator like in Google's example. In order to test run it, I am rendering a button whose onClick event calls the following:

src/App.jsx:

src/App.jsx:

userGesture(){
  //create a new AudioContext
  this.context = new AudioContext();

  //Add our Processor module to the AudioWorklet
  this.context.audioWorklet.addModule('worklet/processor.js').then(() => {

  //Create an oscillator and run it through the processor
  let oscillator = new OscillatorNode(this.context);
  let bypasser = new MyWorkletNode(this.context, 'my-worklet-processor');

  //Connect to the context's destination and start
  oscillator.connect(bypasser).connect(this.context.destination);
  oscillator.start();
  })
  .catch((e => console.log(e)))
}

问题是，每次点击时，addModule 方法都会返回以下错误:

The problem is, on every click, addModule method is returning the following error:

DOMException: The user aborted a request.

我在 Ubuntu v16.0.4 上运行 Chrome v66.

I am running Chrome v66 on Ubuntu v16.0.4.

src/worklet/worklet-node.js:

src/worklet/worklet-node.js:

 export default class MyWorkletNode extends window.AudioWorkletNode {
        constructor(context) {
          super(context, 'my-worklet-processor');
        }
      }

src/worklet/processor.js

src/worklet/processor.js

class MyWorkletProcessor extends AudioWorkletProcessor {
    constructor() {
      super();
    }

    process(inputs, outputs) {
      let input = inputs[0];
      let output = outputs[0];
      for (let channel = 0; channel < output.length; ++channel) {
        output[channel].set(input[channel]);
      }


      return true;
    }
  }

  registerProcessor('my-worklet-processor', MyWorkletProcessor);

推荐答案

我的代码是直接的 JavaScript，而不是 React，但我得到了同样的错误，因为提供给 addModule 的路径不正确.就我而言，调用 addModule 的脚本和作为参数提供给 addModule 的脚本都驻留在同一目录(js")中.尽管如此，我仍然必须在路径中包含此目录以消除错误:

My code is straight JavaScript, not React, but I got the same error because the path provided to addModule was incorrect. In my case, both the script that calls addModule and the script provided as the argument to addModule reside in the same directory ("js"). In spite of that, I still had to include this directory in the path to eliminate the error:

...addModule('js/StreamTransmitter.js')...

我希望这会有所帮助.祝你好运！

I hope this helps. Good luck!

这篇关于AudioWorklet 错误:DOMException:用户中止请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！