javascript - 类型错误 : Failed to set the 'buffer' property on 'AudioBufferSourceNode' : The provided value is not of type 'AudioBuffer

Question

我正在处理现有的 codoCircle .调低音量。

它按预期运行。

现在我想在 codepen 中使用相同的代码我得到这个错误

类型错误:无法在“AudioBufferSourceNode”上设置“缓冲区”属性:提供的值不是“AudioBuffer”类型

我做了一些研究，找到了 first answer有用。

答案是

当我在 playSound player.buffer = buffer 中分配时，缓冲区仍未定义，因为加载回调尚未触发。

这对我来说很有意义，所以我尝试做一个setTimeout 像:

setTimeout(playSound, 9000);

没有成功。

你知道解决这个问题的方法吗？为什么在 CodeCircle 中有效而在 Codepen 中无效？

Answer 1

his makes sense to me, so then i have tried to do a setTimeout like ..

这更像是一个速战速决，但也很棘手，因为您不确定是否已加载所有内容。

解决方案是等到每个样本都加载完毕。最好的方法是使用 Promises为此，但这需要(大)重构和 isn't compatible with all the current browsers (所以你需要 Babel 或 Typescript 等)。

所以我采用了一种更简单的方法:对于每个示例，我都创建了一个 boolean 变量，当加载完成时(在回调函数中)将其设置为 true

var loadedHat = false;
var loadedSnare = false;
var loadedBd = false;

loadSample('cl_hat_3001.wav', function (buffer) {
    hat = buffer;
    loadedHat = true;
    startWhenAllLoaded();
});
loadSample('brp_snrim1.wav', function (buffer) {
    snare = buffer;
    loadedSnare = true;
    startWhenAllLoaded();

});
loadSample('bd08.wav', function (buffer) {
    bd = buffer;
    loadedBd = true;
    startWhenAllLoaded();
});

然后我将您的代码封装到 start 函数中并制作了一个 startWhenAllLoaded，它会在所有树 bool 值都为 true 时启动/p>

function startWhenAllLoaded()
{
    if(!started && loadedHat && loadedSnare && loadedBd){
        started = true;
        start();
    }
}

编辑的codepen是here

注意:不确定现在是否一切正常，错误消失了，但我认为代码需要一些调整