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];
}

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);
});