M36 でのウェブ オーディオの変更

Chris Wilson
Chris Wilson

Web Audio の変更

Google は標準を重視しています。Google は、標準で定義されたウェブ プラットフォームを構築することを目指しています。長い間、Web Audio API の webkit 接頭辞付きの実装(特に webkitAudioContext オブジェクト)と、サポートを継続している Web Audio の非推奨の一部が、この点の小さな問題の 1 つでした。

接頭辞のない AudioContext オブジェクトのサポートが開始されたため、Chrome 36 で接頭辞付きの webkitAudioContext のサポートを削除する予定でした。これは予想よりも面倒な作業であることが判明したため、Chrome 36 では接頭辞なしと接頭辞ありの両方をサポートしています。ただし、再導入された webkitAudioContext でも、createGainNode や createJavaScriptNode などのレガシー メソッドと属性が削除されています。つまり、Chrome 36 では webkitAudioContext と AudioContext は互いのエイリアスであり、機能に違いはありません。

接頭辞のサポートは、Chrome 36 以降(おそらく数回のリリース後)に完全に削除されます。変更が差し迫っている場合は、ここでお知らせします。また、Web Audio アプリケーションの修正について、クリエイターへの連絡を継続しています。

以前の実装に戻すのではなく、この変更を行った理由は何ですか?理由のひとつは、あまり後方互換性を重視しすぎないことです。これらの API はすでに削除されています。また、このエイリアシングの副次的な効果として、Firefox でアプリが正常に動作できるようになります。Firefox は、昨年秋に最初にリリースされた Web Audio サポートで、接頭辞付きの AudioContext オブジェクトをサポートしたことがありません(これは当然です)。

この更新の残りの部分では、この変更によりコードが破損する可能性がある問題を修正するためのガイドを説明します。これらの問題を修正すると、Firefox でもコードが動作する可能性が高くなります。(Firefox の実装が原因でボコーダー アプリケーションが壊れていると長い間思っていましたが、これらの問題の 1 つであることがわかりました)。

すぐに使い始められるようにしたい場合は、古い Web Audio コードで記述されたアプリ用に私が作成したライブラリモンキーパッチを検討してください。オブジェクトとメソッドが適切にエイリアスされるため、最小限の時間で使い始めることができます。実際、ライブラリに表示されるパッチは、変更内容を把握するのに役立ちます。

まず

window.webkitAudioContext への参照は、代わりに window.AudioContext にする必要があります。多くの場合、この問題は次の簡単な手順で解決されています。

window.AudioContext = window.AudioContext || window.webkitAudioContext;

アプリが「お使いのブラウザは Web Audio をサポートしていません。Chrome または Safari を使用してください」というメッセージが表示された場合は、webkitAudioContext を明示的に探している可能性が高いです。デベロッパーが悪い!Firefox をサポートして数か月経っているかもしれません。

ただし、他にも、より微妙なコード削除がいくつかあり、その中にはわかりにくいものもあります。

  • .type 属性(文字列になりました)の BiquadFilter 列挙型定数は BiquadFilterNode オブジェクトに表示されなくなり、.type 属性ではサポートされなくなりました。そのため、.LOWPASS(または 0)は使用せず、「lowpass」に設定します。
  • また、Oscillator.type 属性も同様に文字列列挙型になり、.SAWTOOTH は廃止されました。
  • PannerNode.type も文字列列挙型になりました。
  • PannerNode.distanceModel も文字列列挙型になりました。
  • createGainNode の名前が createGain に変更されました
  • createDelayNode の名前が createDelay に変更されました
  • createJavaScriptNode の名前が createScriptProcessor に変更されました
  • AudioBufferSourceNode.noteOn()start() に置き換えられました
  • AudioBufferSourceNode.noteGrainOn()start() に置き換えられました
  • AudioBufferSourceNode.noteOff() の名前を stop() に変更しました。
  • OscillatorNode.noteOn() の名前を start() に変更しました。
  • OscillatorNode.noteOff() の名前を stop() に変更しました。
  • AudioParam.setTargetValueAtTime() の名前を setTargetAtTime() に変更しました。
  • AudioContext.createWaveTable()OscillatorNode.setWaveTable() の名前が createPeriodicWave() andsetPeriodicWave()` に変更されました。
  • AudioBufferSourceNode.looping が削除され、.loop に置き換えられました
  • エンコードされた音声データの BLOB を同期的にデコードする AudioContext.createBuffer(ArrayBuffer, boolean) が削除されました。完了に時間がかかる同期呼び出しは、不適切なコーディング方法です。代わりに、非同期の decodeAudioData 呼び出しを使用してください。これは、ロジックフローを実際に変更する必要があるため、より難しい変更の一つですが、はるかに優れた方法です。Mozilla の Ehsan Angkari は、標準の Web Audio への変換に関する投稿で、この方法のを記述しています。

これらの多く(createGainNode の名前変更や createBuffer での同期デコードの削除など)は、デベロッパー ツールのコンソールにエラーとして表示されます。ただし、次のような使用方法もあります。

MULTI_LINE_CODE_PLACEHOLDER_1

はまったく表示されず、サイレント エラーになります(myFilterNode.BANDPASS は未定義に解決され、.type を未定義に設定しようとすると、効果が得られなくなります。これが、ボコーダーが機能しなかった原因です)。同様に、filter.type を数値に割り当てるだけで、以前は機能していました。

myFilterNode.type = 2;

ただし、現在は文字列列挙を使用する必要があります。

myFilterNode.type = bandpass;

そのため、次のキーワードでコードを grep することをおすすめします。

  • webkitAudioContext
  • .LOWPASS
  • .HIGHPASS
  • .BANDPASS
  • .LOWSHELF
  • .HIGHSHELF
  • .PEAKING
  • .NOTCH
  • .ALLPASS
  • .SINE
  • .SQUARE
  • .SAWTOOTH
  • .TRIANGLE
  • .noteOn
  • .noteGrainOn
  • .noteOff
  • .setWaveTable
  • .createWaveTable
  • .looping
  • .EQUALPOWER
  • .HRTF
  • .LINEAR
  • .INVERSE
  • .EXPONENTIAL
  • createGainNode
  • createDelayNode
  • .type(誤検出は多くなりますが、上記の最後の例を検出する唯一の方法です)。

急いで実装を開始したい場合は、私のモンキーパッチ webkitAudioContext ライブラリのコピーを取得してアプリに含めてください。音声ハッキングを楽しんでください。