播放音訊
要使用 Web Audio API 播放音訊,我們需要獲取音訊資料的 ArrayBuffer 並將其傳遞給 BufferSource 進行播放。
要獲得要播放的聲音的音訊緩衝區,你需要使用 AudioContext.decodeAudioData
方法,如下所示:
const audioCtx = new (window.AudioContext || window.webkitAudioContext)();
// Fetch the MP3 file from the server
fetch("sound/track.mp3")
// Return the data as an ArrayBuffer
.then(response => response.arrayBuffer())
// Decode the audio data
.then(buffer => audioCtx.decodeAudioData(buffer))
.then(decodedData => {
// ...
});
當最終承諾解決時,你將獲得 AudioBuffer
形式的音訊。這可以附加到 AudioBufferSourceNode
- 並播放 - 就像這樣:
const source = context.createBufferSource();
source.buffer = decodedData; // <==
source.start(...);
其中 .start()
有三個引數可以偏移何時播放樣本,偏移樣本中要播放的位置,並分別說明播放樣本的時間。
有關如何操作緩衝區源的更多資訊可以在 MDN 上找到。