Question

我正在尝试使用HTMLAudioElement和AudioSourceNode测试播放音频。对于以后的应用程序，我需要两个功能：

更改playbackRate后必须保留音高。
需要将音量更改为大于1的值。

由于功能2，我为AudioSourceNode和GainNode添加了一种解决方法。

在以后的应用程序中，我需要音频文件作为ArrayBuffer，这就是为什么我之前添加了文件读取部分。

问题：

该代码与Chrome和Opera兼容，但不适用于Firefox。 playBackRate设置为2，但音频信号的playbackRate不变。为什么会这样，我该如何解决？

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Timestretching 2</title>
  <script type="text/javascript">
      var audioContext = window.AudioContext // Default
          || window.webkitAudioContext // Safari and old versions of Chrome
          || window.mozAudioContext
          || false;

      function play() {
          var fileInput = document.getElementById("file");
          var file = fileInput.files[0];

          var reader = new FileReader();
          reader.onload = function (event) {
              console.log("finished!");
              console.log(event.srcElement.result);

              var audioCtxt = new audioContext();
              var url = URL.createObjectURL(new File([event.srcElement.result], "test.wav"));
              var player = new Audio();

              const source = audioCtxt.createMediaElementSource(player);
              player.src = url;
              console.log("wait to play");
              player.addEventListener("canplay", function () {
                  // create a gain node to set volume greater than 1
                  const gainNode = audioCtxt.createGain();
                  gainNode.gain.value = 2.0; // double the volume
                  source.connect(gainNode);
                  gainNode.connect(audioCtxt.destination);

                  player.playbackRate = 2.0;
                  player.play();
                  player.playbackRate = 2.0;

                  console.log("playbackRate is " + player.playbackRate);
              });
          };

          reader.onprogress = function (progress) {
              console.log(progress.loaded / progress.total);
          };

          reader.onerror = function (error) {
              console.error(error);
          };

          reader.readAsArrayBuffer(file);
      }
  </script>
</head>
<body>
<input id="file" type="file" value="Audio Datei auswählen"/>
<button onclick="play()">PLAY</button>
</body>
</html>

如何结合SourceNode和Firefox设置HTMLAudioElement的playBackRate？

问题：

0 个答案: