javascript - 解码音频数据 - 无法解码音频数据

标签 javascript html web-audio-api

我正在使用AudioContext 的decodeAudioData 方法在Chrome、Firefox 和Opera 中播放音频。所有浏览器都可以成功解码和播放使用 Firefox 录制的音频。但当使用 Chrome 或 Opera 录制音频时,只有 Firefox 能够成功解码并播放。在 Chrome 或 Opera 中解码音频时出现以下错误:

Uncaught (in promise) DOMException: Unable to decode audio data.    

我尝试实现此处提到的 Ladislav Nevery 建议的修复: decodeAudioData returning a null error

实现的代码成功执行了他的建议(遍历缓冲区以查找音频流中的起点),但在 Chrome 中对 Firefox 录制的音频进行解码仍然失败。

您知道解码失败的原因吗?

    function syncStream(node){ // should be done by api itself. and hopefully will.
      var buf8 = new Uint8Array(node.buf);
      buf8.indexOf = Array.prototype.indexOf;
      var i=node.sync, b=buf8;
      while(1) {
        node.retry++;
        i=b.indexOf(0xFF,i); if(i==-1 || (b[i+1] & 0xE0 == 0xE0 )) break;
        i++;
      }
      if(i!=-1) {
        var tmp=node.buf.slice(i); //carefull there it returns copy
        delete(node.buf); node.buf=null;
        node.buf=tmp;
        node.sync=i;
        return true;
      }
      return false;
    }

    export function loadAudio(deckId) {
      store.audioPlayerDomain.audioLoading = true;
      let activeRecord = getActiveRecordByDeckId(deckId);
      let path = `${deckId}/${activeRecord.id}`;
      let context = getAudioContext();
      let processFn = function(node){
        return context.decodeAudioData(node.buf, function (decoded) {
            return decoded;
          },
          function(){ // only on error attempt to sync on frame boundary
            if(syncStream(node)){
              return processFn(node);
            };
          });
      };
      return AudioPlayerWebAPI.default.getAudio(path, context)
        .then((buffer) => {
          let node = {};
          node.buf=buffer;
          node.sync=0;
          node.retry=0;
          return processFn(node);
        }).then(function(decodedData) {
          store.audioPlayerDomain.audio = decodedData;
          store.audioPlayerDomain.audioLoading = false;
          return true;
        });
    }

    ....

    getAudio(path, context) {
    return fetch(`/api/public/audio/${path}`)
      .then(processResponse)
      .then(function(response) {
        if(response.message && response.message === 'non-existent'){
          return null;
        }else{
          return response.arrayBuffer();
        }
      })
    },

最佳答案

直到最近,decodeAudioData 仍无法解码 Chrome 的 MediaRecorder 的结果。尝试使用 Chrome canary 或 beta 来查看此问题是否已修复。如果您仍然遇到问题,请提供一个更完整(但简单)的示例来说明问题所在。

关于javascript - 解码音频数据 - 无法解码音频数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42739112/

相关文章:

javascript - HTML Javascript - 获取所有具有 ID 的元素

javascript - React Image 路径是正确的,但它没有找到/导入它

javascript - 使用 .load() 将图片上传到 div

javascript - THREE.Raycaster 在position.set()之后与原始网格位置相交

javascript - 如何用表单提交时的数据属性替换值? jQuery

javascript - HTML5 录音

javascript - 使用 WebAudioAPI 从 fft 返回哪种格式

javascript - 通过 JavaScript 中的 Web Audio API 静音/取消静音和更改音量

html - 集成两个按钮下拉切换打开

CSS 背景图像不显示(使用 HTML5 样板)