TypeError:无法在'AudioBufferSourceNode'上设置'buffer'属性:提供的值不是'AudioBuffer'类型

Question

我正在研究现有的codoCircle.放下音量.

它按预期工作.

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

TypeError:无法在'AudioBufferSourceNode'上设置'buffer'属性:提供的值不是'AudioBuffer'类型

我做了一些研究,我发现第一个答案很有用.

答案说

在我分配的时候playSound player.buffer = buffer,缓冲区仍然是未定义的,因为加载回调没有被触发.

这对我来说很有意义,所以我试着这样做 setTimeout:

setTimeout(playSound, 9000);

它没有成功.

你知道任何解决方法吗？为什么CodeCircle工作而不是Codepen？

Answer 1

他对我有意义,所以我试着做一个像setTimeout一样的..

这更像是一个quickfix,但是因为你不确定是否所有内容都已加载而很棘手.

解决方案是等到每个样本都加载完毕.最好的方法是使用Promises,但这需要一个(大)重构并且与所有当前浏览器不兼容(所以你需要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,当所有树的布尔值都开始时true

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

编辑过的codepen就在这里

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