html - 每次播放时处理重复声音的 Html5 音频

Question

我正在播放一个 html5 音频文件，该文件具有确定音量的处理算法。第一次玩感觉还不错。第二次播放时，它听起来像是添加了一个同时播放的重复声音。什么被复制？

<audio id="audio1" controls preload="auto" src="test.mp3"></audio>

var context1 = new AudioContext();

 audio1.addEventListener('playing',function() {
    var source = context1.createMediaElementSource(audio1);
    var processor = context1.createScriptProcessor(2048,1,1);
    processor.onaudioprocess = process;
    source.connect(processor);
    processor.connect(context1.destination);
  });

  function process(e) {
    var buffer = e.inputBuffer.getChannelData(0);
    var out = e.outputBuffer.getChannelData(0);
    var amp = 0;

    // Iterate through buffer to get max amplitude
  for (var i = 0; i < buffer.length; i++) {
    var loud = Math.abs(buffer[i]);
    if(loud > amp) {
      amp = loud;
    }
    // write input samples to output unchanged
    out[i] = buffer[i];
}

标签： htmlaudiobuffer

Answer 1

原来我需要断开这个过程。该过程仍在第二次运行。

<audio id="audio1" controls preload="auto" src="test.mp3"></audio>

var context1 = new AudioContext();

source1 = context1.createMediaElementSource(audio1);
processor1 = context1.createScriptProcessor(2048,1,1);

audio1.addEventListener('playing',function() {
    processor1.onaudioprocess = processAudio1;
    source1.connect(processor1);
    processor1.connect(context1.destination);
  });

audio1.addEventListener('ended', (event) => {
   source1.disconnect(processor1);
   processor1.disconnect(context1.destination);
});