Body.arrayBuffer()
Body
ミックスインの arrayBuffer()
メソッドは、Response
ストリームを取得して、完全に読み取ります。 ArrayBuffer
で解決される promise を返します。
構文
response.arrayBuffer().then(function(buffer) { // buffer を使用した何らかの処理 });
パラメーター
なし。
戻り値
ArrayBuffer
で解決される promise。
例
音楽の演奏
fetch array buffer のライブでは、Play ボタンを配置して、押下されると getData()
関数が実行されるようになっています。 再生する前に音声ファイル全体をダウンロードすることに注意してください。 ダウンロード中に演奏を開始したい(つまりストリーム再生したい)なら、次のように HTMLAudioElement
を使いましょう。
new Audio("music.ogg").play();
getData()
関数内では、Request()
コンストラクターを使用して新しいリクエストを作成し、それを使用して OGG 音声トラックをフェッチします。 また、AudioContext.createBufferSource
を使用して、音声バッファーソースを作成します。 フェッチが成功したら、arrayBuffer()
を使用してレスポンスから ArrayBuffer
を読み取り、AudioContext.decodeAudioData
を使用して音声データをデコードし、デコードされたデータを音声バッファーソースのバッファー(source.buffer
)として設定し、それから AudioContext.destination
にソースを接続します。
getData()
の実行が完了すると、start(0)
で音声ソースの再生を開始し、それから再生中に再度再生ボタンをクリックできないようにするために(これはしばしばエラーの原因になります)ボタンを無効化しています。
function getData() {
source = audioCtx.createBufferSource();
var myRequest = new Request('viper.ogg');
fetch(myRequest).then(function(response) {
return response.arrayBuffer();
}).then(function(buffer) {
audioCtx.decodeAudioData(buffer, function(decodedData) {
source.buffer = decodedData;
source.connect(audioCtx.destination);
});
});
};
// wire up buttons to stop and play audio
play.onclick = function() {
getData();
source.start(0);
play.setAttribute('disabled', 'disabled');
}
ファイルを読む
Response()
コンストラクターは、File
と Blob
を受け入れるため、File
を他の形式に読み込むために使用できます。
function readFile(file) {
return new Response(file).arrayBuffer();
}
<input type="file" onchange="readFile(this.files[0])">
仕様
仕様 | 状態 | コメント |
---|---|---|
Fetch arrayBuffer() の定義 |
現行の標準 |
ブラウザーの互換性
BCD tables only load in the browser