JavaScript Web音频：无法正确解码音频数据？

Question

我正尝试在JavaScript中使用Web Audio API将声音加载到缓冲区并播放它。遗憾的是它不工作，我得到了以下错误：

Uncaught TypeError: Failed to set the 'buffer' property on 'AudioBufferSourceNode': 
The provided value is not of type 'AudioBuffer'. 

我可以指出哪些线是给我的错误，但我不知道为什么。下面是相关的代码，如果有帮助：

var audioContext; 
var playSoundBuffer; 

function init() { 
    window.AudioContext = window.AudioContext || window.webkitAudioContext; 
    audioContext = new AudioContext(); 

    loadNote(); 
} 

function loadNote() { 
    var request = new XMLHttpRequest(); 
    request.open("GET", "./sounds/topE.wav", true); 
    request.responseType = "arraybuffer"; 
    request.onload = function() { 
     audioContext.decodeAudioData(request.response, function(buffer) { 
      playSoundBuffer = buffer; 
     }, function(error) { 
      console.error("decodeAudioData error", error); 
     }); 
    }; 
    request.send(); 

    playSound(); 
} 

function playSound() { 
    var source = audioContext.createBufferSource(); 
    source.buffer = playSoundBuffer;  // This is the line that generates the error 
    source.connect(audioContext.destination); 
    source.start(0); 
} 

相信decodeAudioData方法返回一个AudioBuffer其第一个回调函数（第二个参数）。我试图将这个AudioBuffer保存到“playSoundBuffer”然后播放它，但是我得到了这个错误，我不知道为什么。任何帮助将不胜感激。

Answer 1

您得到该错误的原因是因为您忽略了代码的异步性质，并将它看作是同步的。如果您始终记录所有相关部分的内容作为调试的第一步，则您会意识到在您尝试处理缓冲区时，它是undefined而不是AudioBuffer。提示：总是console.log 所有东西，直到你确切地知道它在任何点的行为如何。

function loadNote() { 
    var request = new XMLHttpRequest(); 
    request.open("GET", "./sounds/topE.wav", true); 
    request.responseType = "arraybuffer"; 
    request.onload = function() { 
     audioContext.decodeAudioData(request.response, function(buffer) { 
      playSoundBuffer = buffer; 
      playSound(); // don't start processing it before the response is there! 
     }, function(error) { 
      console.error("decodeAudioData error", error); 
     }); 
    }; 
    request.send();//start doing something async 


}