Wavesurfer scriptNode onaudioprocress 只运行一次

Question

我正在使用 wavesurfer 来映射音频，但是我需要构建一个 VuMeter。

我使用了这个实现，除了在 audioprocess 上只运行一次之外，一切都运行良好。

function playSound(arraybuffer, vuMeterInput, audioSource, playBtn, pauseBtn, volumeController, waveFormID, startAt = 0, sourceNode = undefined) {

    

    

    var context = new AudioContext();

    

    var wavesurfer = WaveSurfer.create({

        container: waveFormID,

        waveColor: '#E0E0E0',

        progressColor: '#64C2EB',

        barWidth: 3,

        height: 20,

        audioContext: context

    });

    

    wavesurfer.load(audioSource.src);

    

    console.log(wavesurfer.backend);

    

    var source = wavesurfer.backend.ac.createBufferSource();

    wavesurfer.backend.source = source;

    

    var gainNode = wavesurfer.backend.ac.createGain();

    

    wavesurfer.backend.ac.decodeAudioData(arraybuffer, function (buffer) {

        wavesurfer.backend.source.buffer = buffer;

        

    });

    wavesurfer.loadDecodedBuffer();

    

    wavesurfer.backend.analyser.smoothingTimeConstant = 0.3;

    wavesurfer.backend.analyser.fftSize = 1024;

    

    wavesurfer.backend.scriptNode.bufferSize = 4096;

    wavesurfer.backend.scriptNode.numberOfInputs = 1;

    wavesurfer.backend.scriptNode.numberOfOutputs = 1;

      

    

    function MapVumeter(){

        var array = new Uint8Array(wavesurfer.backend.analyser.frequencyBinCount);

        valval =  wavesurfer.backend.analyser.getByteFrequencyData(array);

        console.log(valval);

        console.log(Math.average(array));

        vuMeterInput.mono.setAttribute("data-val", Math.average(array));

    }

    wavesurfer.backend.scriptNode.onaudioprocess = MapVumeter;

    

    wavesurfer.backend.source.onended = function() {

        

        $(playBtn).attr('hidden',false);

        $(pauseBtn).attr('hidden',true);

        vuMeterInput.mono.setAttribute("data-val", 0);

    }

    

    

我不确定为什么如果我在 WaveSurfer 之外使用 AudioContext、Analyzer 和 gainNode 但在 wavesurfer 中它只运行一次且 val 的值为 0 Math.average(array);

Answer 1

ScriptProcessorNodewavesurfer.js也在使用它。它可能会覆盖您分配给的事件处理程序onaudioprocess。您可以尝试使用 注册您的事件处理程序addEventListener()。wavesurfer.backend.scriptNode.addEventListener('audioprocess', MapVumeter);