H5音频预加载技巧,让你的页面更快速响应!

13 min read

可以使用Web Audio API中的AudioBufferSourceNode对象进行音频预加载。以下是使用该方法预加载音频的示例代码:

// 创建AudioContext对象
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();

// 创建XMLHttpRequest对象
var request = new XMLHttpRequest();

// 预加载音频文件
request.open('GET', 'audio.mp3', true);
request.responseType = 'arraybuffer';

request.onload = function() {
  // 将下载的音频数据解码并存储
  audioCtx.decodeAudioData(request.response, function(buffer) {
    // 存储已解码的音频数据
    var audioBuffer = buffer;
    
    // 音频数据已成功加载到内存中
  });
}

request.send();

在这个例子中,我们使用了XMLHttpRequest对象来下载音频文件,并将响应的“arraybuffer”类型存储在Web Audio API的AudioContext对象中。一旦音频数据被解码,我们可以将其存储在内存中,以便在需要时进行播放。