--- title: OfflineAudioContext slug: Web/API/OfflineAudioContext translation_of: Web/API/OfflineAudioContext ---
OfflineAudioContext
インターフェイスは {{domxref("AudioContext")}} インターフェイスの一種で、{{domxref("AudioNode")}} をつなげて造られる音声処理グラフを表しています。通常の {{domxref("AudioContext")}} と異なり、OfflineAudioContext
で処理された音声はハードウェアから再生されることはありません。処理された結果は {{domxref("AudioBuffer")}} に出力されます。{{InheritanceDiagram}}
OfflineAudioContext
のインスタンスを作成します。親インターフェイスである {{domxref("BaseAudioContext")}} からのプロパティも継承します。
処理終了時に呼ばれる {{event("Event_handlers", "event handler")}} イベントハンドラーです。 {{event("complete")}} イベント (型は {{domxref("OfflineAudioCompletionEvent")}} )を受け取ります。このイベントは、{{domxref("OfflineAudioContext.startRendering()")}} のイベント駆動型が利用された場合、処理終了時に送出さます。
親インターフェースである {{domxref("BaseAudioContext")}} からのメソッドも継承します。
この例では、{{domxref("AudioContext")}} と OfflineAudioContext
二つのオブジェクトを作っています。AudioContext
はXHR ({{domxref("AudioContext.decodeAudioData")}})でオーディオトラックを読み込むのに使い、OfflineAudioContext
で{{domxref("AudioBufferSourceNode")}} の中に音声をレンダリングし、そしてその音声を再生します。オフライン音声グラフのセットアップが終わった後、{{domxref("OfflineAudioContext.startRendering")}} を使って {{domxref("AudioBuffer")}} にレンダリングする必要があります。
startRendering()
のPromiseが解決されるとレンダリングは完了し、出力結果の AudioBuffer
がPromiseの結果として戻されます。
At this point we create another audio context, create an {{domxref("AudioBufferSourceNode")}} inside it, and set its buffer to be equal to the promise AudioBuffer
. This is then played as part of a simple standard audio graph.
Note: For a working example, see our offline-audio-context-promise Github repo (see the source code too.)
// オンラインとオフラインのオーディオコンテキストを定義 var audioCtx = new AudioContext(); var offlineCtx = new OfflineAudioContext(2, 44100 * 40, 44100); source = offlineCtx.createBufferSource(); // XHRで音声トラックを読み込み、 // decodeAudioData でデコードして OfflineAudioContext で再生する。 function getData() { request = new XMLHttpRequest(); request.open('GET', 'viper.ogg', true); request.responseType = 'arraybuffer'; request.onload = function() { var audioData = request.response; audioCtx.decodeAudioData(audioData, function(buffer) { myBuffer = buffer; source.buffer = myBuffer; source.connect(offlineCtx.destination); source.start(); //source.loop = true; offlineCtx.startRendering().then(function(renderedBuffer) { console.log('Rendering completed successfully'); var audioCtx = new (window.AudioContext || window.webkitAudioContext)(); var song = audioCtx.createBufferSource(); song.buffer = renderedBuffer; song.connect(audioCtx.destination); play.onclick = function() { song.start(); } }).catch(function(err) { console.log('Rendering failed: ' + err); // 注意: OfflineAudioContext の startRendering が二回以上呼び出されるとPromise はリジェクトされます。 }); }); } request.send(); } // getData で処理を開始する。 getData();
仕様書 | 状態 | 備考 |
---|---|---|
{{SpecName('Web Audio API', '#OfflineAudioContext', 'OfflineAudioContext')}} | {{Spec2('Web Audio API')}} | 初回定義 |
{{Compat("api.OfflineAudioContext")}}