Webaudio, воспроизведение звука дважды

Question

Я экспериментирую с WebAudio, и я загружаю звук со следующим кодом javascript.

function playAudio(){ 
    var audio = document.getElementById('music'); 
    var audioContext = new webkitAudioContext(); 
    var analyser = audioContext.createAnalyser(); 
    var source = audioContext.createMediaElementSource(audio); 
    source.connect(analyser); 
    analyser.connect(audioContext.destination); 
    audio.play(); 
} 

Я также хочу, чтобы анализировать звук может визуализировать его брезентом, поэтому в analyser. Он работает нормально в первый раз, но если я запустил эту функцию дважды, я получаю сообщение об ошибке.

> playAudio(); // works fine, i can hear a sound 
> playAudio(); // error 
InvalidStateError: Failed to execute 'createMediaElementSource' on 'AudioContext': invalid HTMLMediaElement. 

В чем причина этой ошибки? Я знаю, что ошибка вызвана этой строки кода:

var source = audioContext.createMediaElementSource(audio); 

Я создаю аудио контекст новый, поэтому я предположил бы, что я могу повторно использовать один и тот же элемент аудио в моем HTML.

Answer 1

Создав звуковой элемент динамически (как показано в этой скрипте, http://jsfiddle.net/ikerr/WcXHK/), я смог воспроизвести песню повторно.

function createAudioElement(urls) { 
    var audioElement = document.createElement("audio"); 

    audioElement.autoplay = true; 
    audioElement.loop = false; 

    for (var i = 0; i < urls.length; ++i) { 
     var typeStr = "audio/" + urls[i].split(".").pop(); 

     if (audioElement.canPlayType === undefined || 
      audioElement.canPlayType(typeStr).replace(/no/, "")) { 
      var sourceElement = document.createElement("source"); 
      sourceElement.type = typeStr; 
      sourceElement.src = urls[i]; 
      audioElement.appendChild(sourceElement); 
      console.log("Using audio asset: " + urls[i]); 
     } 
    } 

    return audioElement; 
} 

var audioContext = new webkitAudioContext(); 

function playAudio(){ 

    var audio = createAudioElement(['http://www.soundjay.com/button/button-1.mp3' ]);  

    if(audio){ 
     var source = audioContext.createMediaElementSource(audio); 
     var analyser = audioContext.createAnalyser(); 
     source.connect(analyser); 
     analyser.connect(audioContext.destination); 
     audio.play(); 
    } 
} 

playAudio(); // works fine, i can hear a sound 
playAudio(); 
//setTimeout(playAudio,2000); 

Демо: http://jsfiddle.net/raathigesh/fueg3mk7/10/