BaseAudioContext: createScriptProcessor() メソッド

非推奨;: この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。

createScriptProcessor()BaseAudioContext インターフェイスのメソッドで、直接音声処理に用いられる ScriptProcessorNode を生成します。

メモ: この機能は AudioWorkletAudioWorkletNode インターフェイスに置き換えられました。

構文

js
createScriptProcessor(bufferSize, numberOfInputChannels, numberOfOutputChannels)

引数

bufferSize

サンプルフレーム単位でのバッファーサイズ。指定する場合、 bufferSize は 256, 512, 1024, 2048, 4096, 8192, 16384 の値のいずれかでなければなりません。これが渡されなかった場合、あるいは値が 0 の場合、実装は与えられた環境に最適なバッファーサイズを選択し、それはノードの寿命を通じて 2 の一定乗となります。

この値は、audioprocess イベントが配信される頻度と、各呼び出しで処理される必要があるサンプルフレームの数を制御します。 bufferSize の値を小さくすると、遅延は小さく(良く)なります。音声が中断したりグリッチを避けるためには、より高い値が必要です。作者はこのバッファーサイズを指定せず、遅延と音質のバランスをとるために、実装が適切なバッファーサイズを選択できるようにすることをお勧めします。

numberOfInputChannels

整数で、このノードの入力のチャンネル数を指定します。既定値は 2 です。32 までの値に対応しています。

numberOfOutputChannels

整数で、このノードの出力のチャンネル数を指定します。既定値は 2 です。32 までの値に対応しています。

警告: Webkit は現在(バージョン 31)、このメソッドを呼び出すときに有効な bufferSize を渡すことを要求しています。

メモ: numberOfInputChannelsnumberOfOutputChannels` の両方が 0 にするのは無効です。

返値

スクリプトプロセッサーを使用してホワイトノイズを追加

次の例は、 AudioContext.decodeAudioData() によって読み込んだトラックを、入力トラック(バッファー)のそれぞれの音声サンプルにホワイトノイズを加えて処理し AudioDestinationNode によって再生する ScriptProcessorNode の基本的な使用方法を示しています。

各チャンネルと各サンプルフレームに対して、スクリプトノードの audioprocess イベントハンドラーが関連する audioProcessingEvent を使用し、入力バッファーの各チャンネルと各チャンネルの各サンプルを通してループし、少量のホワイトノイズを追加してからその結果を各ケースで出力サンプルとしてセットします。

メモ: 完全な例をライブで実行したり、ソースを表示したりすることができます。

js
const myScript = document.querySelector("script");
const myPre = document.querySelector("pre");
const playButton = document.querySelector("button");

// Create AudioContext and buffer source
let audioCtx;

async function init() {
  audioCtx = new AudioContext();
  const source = audioCtx.createBufferSource();

  // Create a ScriptProcessorNode with a bufferSize of 4096 and
  // a single input and output channel
  const scriptNode = audioCtx.createScriptProcessor(4096, 1, 1);

  // Load in an audio track using fetch() and decodeAudioData()
  try {
    const response = await fetch("viper.ogg");
    const arrayBuffer = await response.arrayBuffer();
    source.buffer = await audioCtx.decodeAudioData(arrayBuffer);
  } catch (err) {
    console.error(
      `Unable to fetch the audio file: ${name} Error: ${err.message}`,
    );
  }

  // Give the node a function to process audio events
  scriptNode.addEventListener("audioprocess", (audioProcessingEvent) => {
    // The input buffer is the song we loaded earlier
    let inputBuffer = audioProcessingEvent.inputBuffer;

    // The output buffer contains the samples that will be modified and played
    let outputBuffer = audioProcessingEvent.outputBuffer;

    // Loop through the output channels (in this case there is only one)
    for (let channel = 0; channel < outputBuffer.numberOfChannels; channel++) {
      let inputData = inputBuffer.getChannelData(channel);
      let outputData = outputBuffer.getChannelData(channel);

      // Loop through the 4096 samples
      for (let sample = 0; sample < inputBuffer.length; sample++) {
        // make output equal to the same as the input
        outputData[sample] = inputData[sample];

        // add noise to each output sample
        outputData[sample] += (Math.random() * 2 - 1) * 0.1;
      }
    }
  });

  source.connect(scriptNode);
  scriptNode.connect(audioCtx.destination);
  source.start();

  // When the buffer source stops playing, disconnect everything
  source.addEventListener("ended", () => {
    source.disconnect(scriptNode);
    scriptNode.disconnect(audioCtx.destination);
  });
}

// wire up play button
playButton.addEventListener("click", () => {
  if (!audioCtx) {
    init();
  }
});

仕様書

2014 年 8 月 29 日のウェブオーディオ API 仕様書公開以降、この機能は非推奨となりました。標準化の目処が立たなくなりました。

これは AudioWorkletAudioWorkletNode インターフェイスに置き換えられました。

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
createScriptProcessor
Deprecated

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Deprecated. Not for use in new websites.

関連情報