Is this a bug in firefox or is chrome proactively fixing something I've done wrong?

问题

The following code simply turns a box red whenever the signal from the microphone goes over a set threshold. It merrily runs all day on chromium on linux and chrome on windows. It also runs fine on firefox on both platforms - for all of about 15 seconds. When it stops working on firefox it gives no errors, .getChannelData just starts returning all zeros. Have I discovered a bug in FF or is chrome just doing a better job of clearing up my shonky javascipt?

<!DOCTYPE html>
<html lang="en-us">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
  <style>
    #wrapper { width:100px; height: 100px; background-color: #00F; }
  </style>
</head>
<body>
  <div id="wrapper">
  </div>
  <div id="outs">
    Audio blocks processed: <span id="audProcEnv">none</span><br>
  </div>
  <script>
    const MINFRAMETIME = 100;
    const SCRIPTPROCESSORBUFFER = 1024;
    const TRIGGERTHRESHOLD = 0.1;

    navigator.getUserMedia = (navigator.getUserMedia ||
                              navigator.webkitGetUserMedia ||
                              navigator.mozGetUserMedia ||
                              navigator.msGetUserMedia);

    var audioContext = new (window.AudioContext || window.webkitAudioContext)();
    var gainNode = audioContext.createGain();
    gainNode.gain.value = 0; // Mute the output / Don't output sound - feedback!
    var scriptNode = audioContext.createScriptProcessor(SCRIPTPROCESSORBUFFER, 2, 2);

    var vu = document.querySelector('#wrapper');
    var audioProcessingEventDiv = document.querySelector('#audProcEnv');
    var audioProcessingEventCounter = 0;
    var lastRedraw = 0;
    var signal = false;
    var drawStuff;

    navigator.getUserMedia (
      { audio: true },
      function(stream) {
        var source = audioContext.createMediaStreamSource(stream);
        source.connect(scriptNode);
        scriptNode.connect(gainNode);
        gainNode.connect(audioContext.destination);
        draw();
      },
      function(err) {
        console.log('Error:' + err);
      }
    );

    scriptNode.onaudioprocess = function(audioProcessingEvent) {
      dispPeak = 0;
      signal = false;
      audioProcessingEventCounter++;
      var left = audioProcessingEvent.inputBuffer.getChannelData (0);
      var leftout = audioProcessingEvent.outputBuffer.getChannelData (0);
      for (var sample = 0; sample < SCRIPTPROCESSORBUFFER; sample++) {
        leftout[sample] = left[sample];
        if (left[sample] > dispPeak) { dispPeak = left[sample]; }
        if (left[sample] < -dispPeak) { dispPeak = -left[sample]; }
        if (dispPeak > TRIGGERTHRESHOLD) { signal = true; }
      }
    };

    function draw() {
      drawStuff = requestAnimationFrame(draw);
      if (Date.now() > (lastRedraw + MINFRAMETIME)) {
        if (signal) {
          vu.style.backgroundColor = "#F00";
        } else {
          vu.style.backgroundColor = "#00F";
      }
      audioProcessingEventDiv.innerHTML = audioProcessingEventCounter;
      lastRedraw = Date.now();
      }
    }
    draw();

  </script>
</body>
</html>

来源：https://stackoverflow.com/questions/37688994/is-this-a-bug-in-firefox-or-is-chrome-proactively-fixing-something-ive-done-wro

标签

javascript

html5

google-chrome

firefox

web-audio-api