I am trying to load an audio buffer from an URL, and then to play it. I got most of the code form this HTML5 Rocks Tutorial.

var request = new XMLHttpRequest();

request.open('GET', $(this).attr('data-url'), true);

request.responseType = 'arraybuffer';



request.onload = function() {

    console.log(request);

    context.decodeAudioData(request.response, function(buffer) {

        console.log(buffer);

        $('#play').click(function() {

              var source = context.createBufferSource();

              source.connect(context.destination);

              source.noteOn(0);

        }).removeAttr('disabled');

    }, function(err) { console.log(err); });

};

request.send();

However, then I press the #play button, nothing happens. source.noteOn(0) is called, I checked it using the debugger. And all of the objects are properly loaded and created, but I hear no sound.

Also, as it seems, I would need to rebuild a complete player with all controls when I am using this approach. What I'd like to do, to save work and to ensure this works better, is to put the buffer into an <audio/>, so it can be played there.

I know there is audio.src for putting the file name in there, but I need to use the audio buffer. I've tried

audio.src = buffer;

audio.load()

But that did not work.

Any info there?