Question

我正在尝试使用MediaElementSourceNodes创建一个简单的WebAudio播放器。在谷歌Chrome浏览器按预期工作，但在Firefox中它第一次播放正常，但当我尝试重新启动它时，它不会产生任何声音（没有记录错误）。一种解决方案是为在Firefox上运行的音频元素创建新的源代码，然后在Chrome上为它提供 Uncaught InvalidStateError: Failed to execute 'createMediaElementSource' on 'AudioContext': HTMLMediaElement already connected previously to a different MediaElementSourceNode.另一个解决方案是创建新的Audio元素，它适用于所有浏览器，但随后它重新下载mp3文件，这不是理想的，因为我尝试使用它超过两次。你能解释一下这种行为和可能的解决方案吗？ https://jsfiddle.net/0gw86dzn/（我使用的是Firefox Developer Edition 48.0a2（2016-05-16））

<html>
    <body>
        <input type="button" value="stop" id="stop">
        <input type="button" value="play" id="play">
        <script>
            var context = new AudioContext();

            var audio = new Audio("test.mp3");
            audio.controls = true;

            var source = context.createMediaElementSource(audio);
            source.connect(context.destination);

            var play = document.getElementById('play')
            play.onclick = function () {
              //source = context.createMediaElementSource(audio); // firefox is happy, but chrome bugs.

              //audio = new Audio("test.mp3"); //works, but it redownloads the audio.

              audio.play();
            }

            var stop = document.getElementById('stop');
            stop.onclick = function () {
              audio.pause();
              audio.currentTime = 0;
            }
      </script>
    </body>
</html>

Answer 1

以stop方法“断开”目标源，然后以play方法重新“连通”目标源。那应该解决您的问题。

Firefox中的WebAudio MediaElementSourceNode

1 个答案: