播放音频
要使用 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 上找到。