无法使用 AudioContext 在 JavaScript 中发出声音

如何解决无法使用 AudioContext 在 JavaScript 中发出声音

我想使用 JavaScript 中的 AudioContext API 制作四个游戏按钮来发出声音。我将 onmouseclick 侦听器设置为触发 startTone() 方法，将 onmouseup 设置为触发 stopTone() 方法。但是，由于我确实喜欢本教程，因此它没有声音。这是我的代码：

HTML 按钮部分：

<div id="gameButtonArea">
      <button id="button1" onclick="guess(1)" onmousedown="startTone(1)" onmouseup="stopTone()"></button>
      <button id="button2" onclick="guess(2)" onmousedown="startTone(2)" onmouseup="stopTone()"></button>
      <button id="button3" onclick="guess(3)" onmousedown="startTone(3)" onmouseup="stopTone()"></button>
      <button id="button4" onclick="guess(4)" onmousedown="startTone(4)" onmouseup="stopTone()"></button>
</div>

声音合成器的Javascript初始化：

var context = new AudioContext()
var o = context.createOscillator()
var g = context.createGain()
g.connect(context.destination)
g.gain.setValueAtTime(0,context.currentTime)
o.connect(g)
o.start(0)

JavaScript 的方法定义：

const freqMap = {
  1: 261.6,2: 329.6,3: 392,4: 466.2
}

function playTone(btn,len){ 
  o.frequency.value = freqMap[btn]
  g.gain.setTargetAtTime(volume,context.currentTime + 0.05,0.025)
  tonePlaying = true
  setTimeout(function(){
    stopTone()
  },len)
}

function startTone(btn){
  if(!tonePlaying){
    o.frequency.value = freqMap[btn]
    g.gain.setTargetAtTime(volume,0.025)
    tonePlaying = true
  }
}

function stopTone(){
    g.gain.setTargetAtTime(0,0.025)
    tonePlaying = false
}

解决方法

我通过将声音合成器的初始化放在脚本文件的末尾解决了这个问题。我在控制台中发现了一个错误：

如果像我之前一样一开始就初始化，会出错。