使用Tone.js向现有音频流添加筛选器

Question

我能够使用双四分机将过滤器添加到现有的音频流中，但对尝试使用Tone.js很感兴趣。但我有问题把一切联系在一起。当我试图将过滤器连接到一个DomException时，我一直得到一个audioContext。

function addFilter(fq) {

    var audioCtx = new (window.AudioContext || window.webkitAudioContext);
    var mediaElem = document.getElementById('myAudioElement');

    //Tone.context = audioCtx;
    Tone.context.createMediaElementSource(mediaElem)

    const bqfilter = new Tone.Filter(fq, 'lowpass').toDestination();

    Tone.connect(bqfilter, audioCtx.destination);
    //bqfilter.chain(audioCtx.destination)
});

当我试图将过滤器连接或链接到DomException时，错误消息仅为audioCtx.destination。这似乎跟我在网上找到的大多数其他例子一样，所以我不知道为什么会抛出异常。

*编辑:包括来自dev控制台的堆栈跟踪

Uncaught DOMException                 Tone.js:formatted:2181 
connect     @ Tone.js:formatted:2181
To          @ Tone.js:formatted:8710
(anonymous) @ audiocontrols:983
dispatch    @ jquery.min.js:2
v.handle    @ jquery.min.js:2

Answer 1

您不需要创建自己的AudioContext。您可以只使用Tone.js中的一个。事实上，这甚至是必需的。否则，您自己的AudioNode无法连接到Tone.js创建的那个。

下列措施应能发挥作用：

function addFilter(fq) {
  const audioElement = document.getElementById('myAudioElement');
  const mediaElementSource = Tone.context.createMediaElementSource(audioElement);
  const filter = new Tone.Filter(fq, 'lowpass').toDestination();

  Tone.connect(mediaElementSource, filter);
});

请不要让浏览器的自动播放策略阻止AudioContext，如下所述：https://github.com/Tonejs/Tone.js#starting-audio。