Question

我想为HTML5 Web Audio API编写一个基本脚本，可以播放一些音频文件。但我不知道如何卸载播放音频并加载另一个音频。在我的脚本中，两个音频文件同时播放，但不是我想要的。

这是我的代码：

var context, 
    soundSource, 
    soundBuffer;

// Step 1 - Initialise the Audio Context
context = new webkitAudioContext();

// Step 2: Load our Sound using XHR
function playSound(url) {
    // Note: this loads asynchronously
    var request = new XMLHttpRequest();
    request.open("GET", url, true);
    request.responseType = "arraybuffer";

    // Our asynchronous callback
    request.onload = function() {
        var audioData = request.response;
        audioGraph(audioData);
    };

    request.send();
}

// This is the code we are interested in
function audioGraph(audioData) {
    // create a sound source
    soundSource = context.createBufferSource();

    // The Audio Context handles creating source buffers from raw binary
    soundBuffer = context.createBuffer(audioData, true/* make mono */);

    // Add the buffered data to our object
    soundSource.buffer = soundBuffer;

    // Plug the cable from one thing to the other
    soundSource.connect(context.destination);

    // Finally
    soundSource.noteOn(context.currentTime);
}

// Stop all of sounds
function stopSounds(){
    // How can do this?
}


// Events for audio buttons
document.querySelector('.pre').addEventListener('click', 
    function () {
        stopSounds();
        playSound('http://thelab.thingsinjars.com/web-audio-tutorial/hello.mp3');
    }
);
document.querySelector('.next').addEventListener('click',
    function() {
        stopSounds();
        playSound('http://thelab.thingsinjars.com/web-audio-tutorial/nokia.mp3');
    }
);

Answer 1

您应该在启动时将声音预先加载到缓冲区中，然后只要您想要播放它就重置AudioBufferSourceNode。

要按顺序播放多个声音，您需要根据缓冲区各自的长度，依次使用noteOn(time)来安排它们。

要停止声音，请使用noteOff。

听起来你错过了一些基本的网络音频概念。这个（以及更多）将详细描述，并在此HTML5Rocks tutorial和FAQ中显示样本。

Web Audio API：如何加载另一个音频文件？

1 个答案: