Safari呼吁使用Chrome工作的Null犯错

Question

我正在使用 getUserMedia()和 mediaRecorder记录音频，然后将其存储在服务器上。后来，它从服务器中检索，存储客户端，然后当用户单击播放按钮时，它未编码并播放。播放在Chrome上正常工作，但是在Safari decodeAudioData上，将null ERR投入到捕获功能中。我已经对此进行了大量研究，但看不到会抛出例外的是什么。

记录代码是：

      navigator.getUserMedia = ( navigator.getUserMedia ||
                                 navigator.webkitGetUserMedia ||
                                 navigator.mozGetUserMedia ||
                                 navigator.msGetUserMedia);
      if (navigator.getUserMedia) {
        //console.log('getUserMedia supported.');
        navigator.getUserMedia (
          { // constraints - only audio needed for this app
            audio: true
          },
          // Success callback
          function(stream) {
            const mediaRecorder = new MediaRecorder(stream);
            mediaRecorder.ondataavailable = audio.saveRecordedAudio;
          });
       }

播放代码是：

      const audioCtx = new (window.AudioContext || window.webkitAudioContext)();
      const source = audioCtx.createBufferSource();
      const binaryAudioBlob = audio.b64toBlob(b64String);
      const reader = new FileReader();
      reader.addEventListener("loadend", function() {
        const bufferArray = reader.result;
        audioCtx.decodeAudioData(bufferArray, (buffer) => {
          source.buffer = buffer;
          source.connect(audioCtx.destination);
          source.start(0);
          console.log('started audio from blob');
        }, function(e){ 
          console.log("Error with decoding audio data" + e);  // e is null
        });
      });
      reader.readAsArrayBuffer(binaryAudioBlob);

b64toBlob函数是：

    b64toBlob: (b64Data, contentType, sliceSize) => {
      contentType = contentType || '';
      sliceSize = sliceSize || 512;
      const byteCharacters = atob(b64Data);
      const byteArrays = [];
      for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
        const slice = byteCharacters.slice(offset, offset + sliceSize);
        const byteNumbers = new Array(slice.length);
        for (let i = 0; i < slice.length; i++) {
          byteNumbers[i] = slice.charCodeAt(i);
        }
        const byteArray = new Uint8Array(byteNumbers);
        byteArrays.push(byteArray);
      }
      const blob = new Blob(byteArrays, {type: contentType});
      return blob;
    }

用Chrome记录了音频。Chrome是否有可能以Safari无法播放的格式编码音频？据我所知，默认值是wav，所以我认为野生动物园可以扮演这种格式（vs say ogg）。

任何提示都非常感谢。

Answer 1

Chrome和Firefox浏览器使用Mediarecorder录制音频流的默认格式是Opus。

Safari无法阅读这种格式，这就是AudioContext.decodeAudioData()这样的输入失败的原因。

Answer 2

Safari 11 使用WebAssembly播放Opus文件。您需要绕过decodeAudioData()并直接使用Web音频API。请参阅下面的示例：

https://fetch-stream-audio.anthum.com/