OfflineAudioContext.startRendering()

startRendering()OfflineAudioContext のメソッドで、オーディオグラフのレンダリングを開始します。このインターフェイスは、現在の接続と現在のスケジュール変更を考慮して、音声グラフのレンダリングを開始します。

complete イベント(OfflineAudioCompletionEvent 型)がレンダリングが完了すると発生し、その結果である AudioBufferrenderedBuffer プロパティに格納されます。

ブラウザーの対応する startRendering() メソッドには、古いイベントベースと新しいプロミスベースの 2 つのバージョンがあります。前者はいずれ削除される予定ですが、現在は古い理由のために両方のメカニズムが提供されています。

構文

startRendering()

引数

なし。

返値

なし (undefined)。

この単純な例では、AudioContextOfflineAudioContext オブジェクトの両方を宣言しています。次に OfflineAudioContext を使用して、音声を BaseAudioContext.decodeAudioData にレンダリングし、その音声を再生します。オフライン音声グラフを設定したら、OfflineAudioContext.startRendering を使用して AudioBuffer にレンダリングする必要があります。

startRendering() のプロミスが解決すると、レンダリングが完了しており、出力の AudioBuffer がプロミスから返されます。

この時点で、別の音声コンテキストを作成し、その中に AudioBufferSourceNode を作成し、そのバッファーをプロミス AudioBuffer と等しくなるように設定します。これは単純な標準音声グラフの一部として再生されます。

メモ: 動作する例については、 offline-audio-context-promise を GitHub リポジトリーで参照してください(ソースコードも参照)。

// define online and offline audio context

const audioCtx = new AudioContext();
const offlineCtx = new OfflineAudioContext(2,44100*40,44100);

source = offlineCtx.createBufferSource();

// use XHR to load an audio track, and
// decodeAudioData to decode it and OfflineAudioContext to render it

function getData() {
  request = new XMLHttpRequest();

  request.open('GET', 'viper.ogg', true);

  request.responseType = 'arraybuffer';

  request.onload = () => {
    const audioData = request.response;

    audioCtx.decodeAudioData(audioData, (buffer) => {
      myBuffer = buffer;
      source.buffer = myBuffer;
      source.connect(offlineCtx.destination);
      source.start();
      //source.loop = true;
      offlineCtx.startRendering().then((renderedBuffer) => {
        console.log('Rendering completed successfully');
        const offlineAudioCtx = new AudioContext()
        const song = offlineAudioCtx.createBufferSource();
        song.buffer = renderedBuffer;

        song.connect(offlineAudioCtx.destination);

        play.onclick = () => {
          song.start();
        }
      }).catch((err) => {
          console.error(`Rendering failed: ${err}`);
          // Note: The promise should reject when startRendering is called a second time on an OfflineAudioContext
      });
    });
  }

  request.send();
}

// Run getData to start the process off

getData();

仕様書

Specification
Web Audio API
# dom-offlineaudiocontext-startrendering

ブラウザーの互換性

BCD tables only load in the browser

関連情報