可以提取音频文件的一部分并加载到AudioBufferSourceNode中吗

Question

我正试图在一个需要使用AudioBufferSourceNode的项目中优化音频文件的加载时间。它需要加载音频缓冲区。。但我可以先加载前10分钟的音频，然后在后台下载其他部分时播放吗。然后创建另一个源节点，加载音频文件的第二部分。

我当前的实现首先加载所有音频。这不太好，因为它需要时间。我的文件有60-70 MB长。

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();
}

Answer 1

我认为您可以通过使用WebCodecs API(目前仅在Chrome中提供(来实现您想要的目标，但它需要一些管道。

要将文件作为流获取，可以使用fetch()而不是XMLHttpRequest。

然后，您需要对编码文件进行解复用，以获得原始音频数据，并使用AudioDecoder对其进行解码。如果运气好的话，它将输出AudioData对象。这些对象可用于获取原始样本数据，然后可用于创建AudioBuffer。

目前还没有太多可用的WebCodecs示例。我认为展示如何解码MP4的示例与您目前可用的用例最相似。