From 6ef1fa4618e08426b874529619a66adbd3d1fcf0 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 12:07:59 +0100 Subject: unslug ja: move --- .../baseaudiocontext/decodeaudiodata/index.html | 155 +++++++++++++++++++++ 1 file changed, 155 insertions(+) create mode 100644 files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html (limited to 'files/ja/web/api/baseaudiocontext/decodeaudiodata') diff --git a/files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html b/files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html new file mode 100644 index 0000000000..db9c106e52 --- /dev/null +++ b/files/ja/web/api/baseaudiocontext/decodeaudiodata/index.html @@ -0,0 +1,155 @@ +--- +title: AudioContext.decodeAudioData() +slug: Web/API/AudioContext/decodeAudioData +tags: + - API + - Audio + - AudioContext + - BaseAudioContext + - Method + - Reference + - Web Audio API + - decodeAudioData +translation_of: Web/API/BaseAudioContext/decodeAudioData +--- +

{{ APIRef("Web Audio API") }}

+ +

decodeAudioData() は {{ domxref("BaseAudioContext") }} のメソッドで、 {{domxref("ArrayBuffer")}} に書き込まれた音声ファイルデータを非同期にデコードするために使用されます。この場合、 ArrayBuffer は {{domxref("XMLHttpRequest")}} と {{domxref("FileReader")}} から読み込まれます。デコードされた {{domxref("AudioBuffer")}} は {{domxref("AudioContext")}} のサンプリングレートにリサンプリングされ、コールバックやプロミスに渡されます。

+ +

この方法は、オーディオトラックから Web Audio API 用のオーディオソースを作成する際に推奨される方法です。この方法は、音声ファイルの断片的なデータではなく、完全なファイルデータに対してのみ動作します。

+ +

構文

+ +

古いコールバック構文:

+ +
baseAudioContext.decodeAudioData(ArrayBuffer, successCallback, errorCallback);
+ +

新しいプロミスベースの構文:

+ +
Promise<decodedData> baseAudioContext.decodeAudioData(ArrayBuffer);
+ +

引数

+ +
+
ArrayBuffer
+
デコードする音声データが入った ArrayBuffer です。通常は{{domxref("XMLHttpRequest")}}, {{domxref("WindowOrWorkerGlobalScope.fetch()")}}, {{domxref("FileReader")}} から取得します。
+
successCallback
+
デコードが完了すると呼び出されるコールバック関数です。このコールバックの引数は1つで、 decodedData (デコードされた PCM 音声データ) を表す {{domxref("AudioBuffer")}} です。通常は、デコードされたデータを {{domxref("AudioBufferSourceNode")}} に入れて、そこから再生したり、好きなように操作したりすることができます。
+
errorCallback
+
任意のエラーコールバックで、音声データのデコードでエラーが発生すると呼び出されます。
+
+ +

返値

+ +

なし、または decodedData で満足する {{domxref("Promise") }} オブジェクトで.

+ +

例

+ +

ここでは最初に古いコールバックベースのシステムを、次に新しいプロミスベースの構文を取り上げます。

+ +

古いコールバックベースの構文

+ +

この例では、 getData() 関数は XHR を使用して音声トラックを読み込み、リクエストの responseType を arraybuffer に設定して、レスポンスとして配列バッファーを返すようにして、それを audioData 変数に格納しています。それからこのバッファーを decodeAudioData() 関数に渡します。成功したコールバックは、デコードに成功した PCM データを受け取り、 {{ domxref("AudioContext.createBufferSource()") }} で作成した {{ domxref("AudioBufferSourceNode") }} に入れ、ソースを {{domxref("AudioContext.destination") }} に接続してループするように設定します。

+ +

ボタンは単に getData() を実行して、それぞれトラックの読み込みと再生、停止を行うだけです。ソースの stop() メソッドが呼ばれると、ソースは消滅します。

+ +
+

注: ライブ例の実行 (またはソースの閲覧) もできます。

+
+ +
// 変数の定義
+
+var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var source;
+
+var pre = document.querySelector('pre');
+var myScript = document.querySelector('script');
+var play = document.querySelector('.play');
+var stop = document.querySelector('.stop');
+
+// 音声トラックの読み込みには XHR を使い、
+// decodeAudioData でデコードし、バッファーに格納する
+// そして、そのバッファーを source に設定する
+
+function getData() {
+  source = audioCtx.createBufferSource();
+  var request = new XMLHttpRequest();
+
+  request.open('GET', 'viper.ogg', true);
+
+  request.responseType = 'arraybuffer';
+
+
+  request.onload = function() {
+    var audioData = request.response;
+
+    audioCtx.decodeAudioData(audioData, function(buffer) {
+        source.buffer = buffer;
+
+        source.connect(audioCtx.destination);
+        source.loop = true;
+      },
+
+      function(e){ console.log("Error with decoding audio data" + e.err); });
+
+  }
+
+  request.send();
+}
+
+// 音声の停止と再生を行うボタン
+
+play.onclick = function() {
+  getData();
+  source.start(0);
+  play.setAttribute('disabled', 'disabled');
+}
+
+stop.onclick = function() {
+  source.stop(0);
+  play.removeAttribute('disabled');
+}
+
+
+// pre要素にスクリプトを設定する
+
+pre.innerHTML = myScript.innerHTML;
+ +

新しいプロミスベースの構文

+ +
ctx.decodeAudioData(audioData).then(function(decodedData) {
+ // デコードしたデータをここで使う
+});
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様状態備考
{{SpecName('Web Audio API', '#dom-baseaudiocontext-decodeaudiodata', 'decodeAudioData()')}}{{Spec2('Web Audio API')}}
+ +

ブラウザーの互換性

+ +
+ + +

{{Compat("api.BaseAudioContext.decodeAudioData")}}

+
+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf