1

我用来getAudioTracks()从视频元素中获取音频。然后我需要放大(增加音量)这个audioTrack,然后再将它添加到画布中,addTrack()并使用webrtc 将它们流走。

有没有办法在客户端使用 javascript 做到这一点?

4

1 回答 1

2

我提出了一个解决方案。对于任何需要同样东西的人:

            // supposing we have the getUserMedia stream and a canvas
            // we want to stream the canvas content and the
            // amplified audio from user's microphone

            var s = canvas.captureStream();

            var context = new AudioContext(); 

            var gainNode = context.createGain();
            gainNode.gain.value = 1;

            // compress to avoid clipping
            var compressor = context.createDynamicsCompressor();
            compressor.threshold.value = -30;
            compressor.knee.value = 40;
            compressor.ratio.value = 4;
            compressor.reduction.value = -10;
            compressor.attack.value = 0;
            compressor.release.value = 0.25;

            var destination = context.createMediaStreamDestination();

            var input = context.createMediaStreamSource(stream); 

            input.connect(compressor); 
            compressor.connect(gainNode); 
            gainNode.connect( destination); 

            var audioTracks = destination.stream.getAudioTracks();

            // use a slider to alter the value of amplification dynamically
            var rangeElement = document.getElementById("amplifierSlider"); 
            rangeElement .addEventListener("input", function() {
                gainNode.gain.value = parseFloat(rangeElement .value); 
            }, false); 

            for (var i=0; i < audioTracks.length; i++) {  
                s.addTrack(audioTracks[i]);   
            } 

            // stream the canvas with the added audio tracks

https://jsfiddle.net/Thanos_Sar/Lt00nr8g/

于 2017-02-05T08:13:55.863 回答