Search code examples
javascripthtmlhtml5-audioweb-audio-api

Web Audio loops with <audio> as source


I understand that I can manipulate the audio stream with Web Audio using createMediaElementSource() but is it possible to play / loop the audio with Web Audio and use the tag purely for loading the audio?

This is what I tried but it says start() is not a function:

window.onload = init;
var context;
var bufferLoader;

function init() {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
    context = new AudioContext();

    var audio = $("audio").get(0);
    var source = context.createMediaElementSource(audio);
    source.connect(context.destination);
    source.start(0);
}

Solution

  • window.onload = init;
    
    function init() {
        window.AudioContext = window.AudioContext || window.webkitAudioContext;
    
        var context = new AudioContext();
    
        var audio = $("audio").get(0);
    
        audio.addEventListener('loadstart', function() {
            var source = context.createMediaElementSource(audio);
            source.connect(context.destination);
    
            audio.play(0);
        }, false);
    }
    

    Refer to https://github.com/Korilakkuma/XSound/blob/master/build/xsound.dev.js#L9703 in XSound.js