Play multiple wave at the same time

Question

I have two files mywave1.wav1 mywave2.wav and want to play two files at the same time.

For now I try to play each waves separately , but it is not assured to start at the same time.

  var context = new AudioContext();
  var buffer = null;
  var source = context.createBufferSource();
  var request = new XMLHttpRequest();
  var source2 = context.createBufferSource();
  var request2 = new XMLHttpRequest();

  request.open('GET', 'http://localhost:8000/mywave1.wav' , true);
  request.responseType = 'arraybuffer';
  request.send();

  request.onload = function () {
    var res = request.response;
    context.decodeAudioData(res, function (buf) {
      source.buffer = buf;
    });
  };

  source.connect(context.destination);
  source.start(0);
  
  request2.open('GET', 'http://localhost:8000/mywave2.wav', true);
  request2.responseType = 'arraybuffer';
  request2.send();

  request2.onload = function () {
    var res = request.response;
    context.decodeAudioData(res, function (buf) {
      source2.buffer = buf;
    });
  };

  source2.connect(context.destination);
  source2.start(0);

What is the best practice to play the multiple audio file at the same time for Web Audio API??

Answer 1

I found this project. It fulfill my requests.

https://github.com/naomiaro/waveform-playlist