2017-01-30 27 views
1

저는 비디오 요소에서 오디오를 가져 오는 데 getAudioTracks()을 사용합니다. 그런 다음이 오디오 트랙을 증폭 (볼륨 높이기)해야 캔버스에 addTrack()으로 추가하고 스트림은 모두 webrtc로 스트리밍합니다.webrtc로 스트림 전에 MediaStreamTrack (오디오)을 증폭하십시오.

자바 스크립트로 클라이언트 측에서이 작업을 수행 할 수있는 방법이 있습니까?

답변

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/

: 같은 일을 필요로 사람들을위한