自分の備忘録も兼ねて、ベーシックな、かつ比較的確実に音が出るコードとして下記。
画面をクリックすると、440Hz（A4 / ラ）の音が1秒間再生されます。
See the Pen 440Hz Tone by ts5h (@ts5h) on CodePen.
留意点など
-
new OscillatorNode(audioContext)は、mobile Safariでは動作しませんでした。代わりに、audioContext.createOscillator()のように書くと良いようです。 - 続けてクリックすると、現在再生中の音に加えてどんどんオシレータが生成されるので、クリップします。本当は、クリック時に再生中の音をカットするか、リミッタをかますなどの対策が必要。
- IEでは動作しません。
Web Audio APIは若干マイナーなためか情報が散逸的で、貴重なサンプルを見つけても、2021年現在では、そのままだと全然音が出なかったりします。
特に、個人的にはiPhone mobile Safariが鬼門かなと思います。
また、デスクトップ環境でもアクセス時にいきなり音が出るのは迷惑だということで、明示的に自動再生を許可しているか、ユーザーが何らかの操作をしない限りは音声再生はブロックされるとされているため、こうした条件をクリアするような記述方法を考慮する必要があります。（何故か音が出る場合もあるが、そちらはむしろ想定外の動作と思われる）
Chrome 66では自動再生が許可されている場合を除き、ユーザーが何らかの操作をしない限り音声再生がブロックされる。Web Audio APIを使用する場合、ページ読み込み時にAudioContextオブジェクトを作成すると、ユーザーの操作後にresume()メソッドを実行しなければ音声は再生されない。
注意点
上記サンプルは、2021年春時点で確認したものです。
今後またこのあたりの仕様は変わる可能性があります。
面倒くさい
にあるように、多分Tone.js等をラッパーとして挟んだ方が取り回しが良いでしょう。