2017-01-30 7 views
1

J'utilise getAudioTracks() pour obtenir l'audio d'un élément vidéo. Ensuite, j'ai besoin d'amplifier (augmenter le volume) de cet audioTrack avant de l'ajouter à une toile avec addTrack() et de diffuser les deux avec webrtc.Amplifier MediaStreamTrack (audio) avant le flux avec webrtc

Y a-t-il un moyen de faire cela du côté client avec javascript?

Répondre

2

J'ai inventé une solution. Pour toute personne qui a besoin de la même chose:

  // 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/