2017-01-30 16 views
1

Я использую getAudioTracks(), чтобы получить аудио с видеоэлемента. Затем мне нужно усилить (увеличить громкость) этого аудиодорожка до того, как я добавлю его на холст с помощью addTrack() и передам оба с webrtc.Amplify MediaStreamTrack (аудио) перед потоком с webrtc

Есть ли способ сделать это на стороне клиента с помощью javascript?

ответ

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/