我使用Codepen编写了一个简单的合成器。它实际上可以工作，并且可以实现我期望的功能（在Codepen上和网站上的调试模式下）。
不幸的是，它在我的本地计算机上不起作用：如果我下载代码并尝试运行它，它将给我我在问题标题中提到的错误。
如果我将代码“硬拷贝”到浏览器控制台中并运行它，则可以完美运行。
这是我的完整应用程序，只要您将鼠标悬停在带有相应音符的音垫上，它就会播放一些合成音：https://codepen.io/mattiasu96/pen/pxPXpB
//Simple definition of some filter and oscillator to create a composite sound
------------------------------------------
var filter = new Tone.AutoFilter(2,40,2.5).toMaster();
filter.depth=1;
filter.wet=1;
filter.filter.rolloff=-48;
filter.start();
var synth = new Tone.Synth({
oscillator: {
type: 'sawtooth',
},
envelope: {
attack: 0.001,
decay: 0.1,
sustain: 5,
release: 0.1
}
}).connect(filter);
var synthB = new Tone.Synth({
oscillator: {
type: 'sawtooth',
detune : -10 ,
},
envelope: {
attack: 0.001,
decay: 0.1,
sustain: 5,
release: 0.1
}
}).connect(filter);
var synthC = new Tone.Synth({
oscillator: {
type: 'sawtooth',
detune : +10 ,
},
envelope: {
attack: 0.001,
decay: 0.1,
sustain: 5,
release: 0.1
}
}).connect(filter);
var synthD = new Tone.Synth({
oscillator: {
type: 'sawtooth',
detune : -5 ,
},
envelope: {
attack: 0.001,
decay: 0.1,
sustain: 5,
release: 0.1
}
}).connect(filter);
var synthE = new Tone.Synth({
oscillator: {
type: 'sawtooth',
detune : -2 ,
},
envelope: {
attack: 0.001,
decay: 0.1,
sustain: 5,
release: 0.1
}
}).connect(filter);
var mode = 0; // 0 = modalità single note, 1 = modalità multiple notes
notes = document.querySelectorAll(".hex");
----------------------------------------
// Triggering the notes using the pads i have created
notes.forEach(function(note) {
note.addEventListener("mouseover", function(event){
x = event.target.title;
filter.baseFrequency=x;
synth.triggerAttack(x);
synthB.triggerAttack(x);
synthC.triggerAttack(x);
synthD.triggerAttack(x);
synthE.triggerAttack(x);
});
});
notes.forEach(function(note) {
note.addEventListener("mouseout", function(event){
x = event.target.title;
synth.triggerRelease();
synthB.triggerRelease();
synthC.triggerRelease();
synthD.triggerRelease();
synthE.triggerRelease();
});
});
就像我上面提到的，这一切都很好，但不适用于本地。该代码实际上是正确的，因为它可以在Codepen上正常工作，并且如果我在浏览器调试控制台中对其进行硬拷贝也可以正常工作。
我不知道为什么我得到这个错误。
最佳答案
您正在描述的问题听起来像浏览器不允许在没有任何用户交互的情况下启动AudioContext（由Tone.js使用）。不幸的是，“ mouseover”和“ mouseout”事件不算作用户交互。
因此，您需要在某个地方添加一个按钮，该按钮可在单击事件时激活AudioContext。有一个short description in the README of Tone.js描述了如何完成。
控制AudioContext是可以自己启动还是必须由用户交互激活的机制通常称为自动播放策略。可以在特定站点上禁用该策略。例如，Chrome浏览器还会维护一个过去播放过音频的网站列表，以使那些习惯于播放音频的网站无需任何用户交互。我想您的计算机上的https://codepen.io/就是这种情况。
当借助开发工具运行代码时，自动播放策略通常也不会起作用，这可能也是为什么它也对您有效的原因。
关于javascript - Tone.js-AudioContext不允许启动，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/57289003/