2017-01-30 5 views
1

私はgetAudioTracks()を使用して、ビデオ要素からオーディオを取得します。そして、私はそれをキャンバスにaddTrack()で追加する前に、このaudioTrackを増幅(ボリュームを増加)して、両方をwebrtcでストリームする必要があります。webrtcでストリームを再生する前にMediaStreamTrack(オーディオ)を増幅します

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/

:同じことを必要とする人のために
関連する問題