如何在断网状态下播放缓存音频?

如何在断网状态下播放缓存音频?

如何在断网状态下播放缓存音频

在需要离线播放音频时,可以使用 base64 编码将音频数据存储在本地,然后断网后使用本地缓存播放。具体步骤如下:

  1. 加载音频数据:在有网络连接时,使用 fetch api 获取音频数据。
  2. 转为 base64:使用 filereader 对象将音频数据转换为 base64 格式。
  3. 存储到本地:将转换后的 base64 数据存储在 localstorage 中,并设置一个唯一的键(例如音频文件名)来引用它。
  4. 断网播放:断网后,从 localstorage 中获取 base64 数据。
  5. 解析 base64:分离出 mime 类型和实际的 base64 内容。
  6. 转换回 blob:将 base64 字符串转换为 blob 对象
  7. 创建 audio 对象使用 blob 对象创建 audio 对象,然后调用 play() 方法播放音频。

例如,可以参考以下代码:

function loadAudio(url) {   fetch(url)     .then(response => response.blob())     .then(blob => {       let reader = new FileReader();       reader.onloadend = function () {         let base64data = reader.result;         localStorage.setItem('audio-cache', base64data);       };       reader.readAsDataURL(blob);     }); }  function playCachedAudio() {   let base64data = localStorage.getItem('audio-cache');   let [contentType, base64String] = base64data.split(';base64,');   let decodedData = atob(base64String);   let arrayBuffer = new ArrayBuffer(decodedData.length);   let uint8Array = new Uint8Array(arrayBuffer);   for (let i = 0; i 
登录后复制

© 版权声明
THE END
喜欢就支持一下吧
点赞8 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容