CODEWITHSUNDEEP
javascriptajaxaudio
Dang Hai Luong
Dang Hai Luong

Reputation: 1356

Use XMLHttpRequest to load multiple audio files and append them to play in Web Audio API

I have a web that do, load three different audio files (each one second though) with determined order and then merge then into one single Audio Buffer (one after another).

To demonstrate what I want to do, this is the sample code snippet:

var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContextApp = new AudioContext();

var buffer1 = audioContextApp.createBufferSource();
var buffer2 = audioContextApp.createBufferSource();
var buffer3 = audioContextApp.createBufferSource();

var request1 = new XMLHttpRequest;
request1.open('GET', URL_FIRST_SOUND, true);
request1.onload = function() {
var undecodedAudio = request1.response;
            audioContextApp.decodeAudioData(undecodedAudio, function(buffer) {
            buffer1.buffer = buffer; 
            });
}
request1.load()

// DO the same thing with request2, request3 to load second and third sound.

Now I don't know how to properly append those 3 audio buffers into one and let the user play the merged audio.

Upvotes: 1

Views: 299

Answers (1)

Dang Hai Luong
Dang Hai Luong

Reputation: 1356

Well I figured out one solution myself. When I connected each buffer to the audioContext.destination, I can simply specify the time when the second audio play, which is the current time plus the duration of the first AudioBuffer.

Upvotes: 1

Related Questions