Web Audio 同时加载 .mp3 和 .ogg

Web Audio load both .mp3 and .ogg

我正在使用 javascript 和网络音频构建 canvas 游戏。为了让它在 Firefox 中工作,我有一份 .ogg 格式的所有音频文件的副本。加载这些文件的代码如下。要获得所需的音频文件,我使用' playSound(samplebb[3], channel1); ',我这样做是因为在我的应用程序中,根据数字选择样本很有用,例如可以使用概率和随机性来选择声音。

我在论坛上读到 "the loader will accept both [mp3 and ogg] for the same sound, just pass both paths in an array rather than a single string." 第 4 行代码是我尝试的,但它不起作用。

是否可以像这样为每个 mp3 加载一个替代的 ogg 文件? (在一个缓冲列表中)或者如果浏览器是 Firefox,我是否必须检测浏览器并构建一个 oggs 缓冲列表?

谢谢

function loadSounds() {
bufferLoader = new BufferLoader(audioContext,
    [
        ['sounds/1-KICK.mp3', 'sounds/1-KICK.ogg'],      //0  // Not found
        'sounds/2-BASS.mp3',      //1
        'sounds/3-BASS2.mp3',     //2
        'sounds/4-BASS4.mp3'      //3
        // ...  ...   ...
    ],
    finishedLoading
);
bufferLoader.load();
}


function finishedLoading(bufferList) {
for (var i = 0, l = bufferList.length; i < l; i += 1) {
    var source = audioContext.createBufferSource();
    source.buffer = bufferList[i];
    source.connect(audioContext.destination);
    var note = {
        note: source,
        ready: true
    };
    samplebb.push(note);
}
setTimeout(play, 1000);
}

Are you using BufferLoader from html5rocks? If so, the JS file 清楚地表明它只需要字符串(而不是数组)作为 url 参数。但是,您可以修改 class 以使其按您希望的方式工作。请改用以下 BufferLoader.loadBuffer() 函数:

BufferLoader.prototype.loadBuffer = function(url, index) {
    // Load buffer asynchronously
    var request = new XMLHttpRequest(),
      mult = typeof url != 'string',
      srcInd = 0;
    request.open("GET", mult ? url[srcInd++] : url, true);
    request.responseType = "arraybuffer";

    var loader = this;

    request.onload = function() {
        // Asynchronously decode the audio file data in request.response
        loader.context.decodeAudioData(
            request.response,
            function(buffer) {
                if (!buffer) {
                    if(!mult || srcInd == url.length) {
                        console.error('error decoding file data:', url);
                        return;
                    } else {
                        console.info('error decoding file data, trying next source');
                        request.open("GET", url[srcInd++], true);
                        return request.send();
                    }
                }
                loader.bufferList[index] = buffer;
                if (++loader.loadCount == loader.urlList.length)
                    loader.onload(loader.bufferList);
            },
            function(error) {
                if(!mult || srcInd == url.length) {
                    console.error('decodeAudioData error:', url);
                    return;
                } else {
                    console.info('decodeAudioData error, trying next source');
                    request.open("GET", url[srcInd++], true);
                    return request.send();
                }
            }
        );
    }

    request.onerror = function() {
        if(!mult || srcInd == url.length) {
            console.error('BufferLoader XHR error:', url);
            return;
        } else {
            console.info('BufferLoader XHR error, trying next source');
            request.open("GET", url[srcInd++], true);
            return request.send();
        }
    }

    request.send();
}