Audio Level Meter für Web RTC Stream

Question

Ich möchte ein Dezibel-Meter für das Audio erstellen, das in einem Videoelement abgespielt wird. Das Videoelement spielt einen WebRTC-Stream ab.

Momentan können WebRTC-Streams nicht an einen Web Audio Analyzer übergeben werden. (Dies könnte sich bald ändern ...) (siehe Web Audio API analyser node getByteFrequencyData returning blank array)

Gibt es derzeit eine andere Möglichkeit, Dezibel-Informationen von einem Remote-Media-Stream zu erhalten?

Answer 1

Chrome 50 wurde veröffentlicht: Ab dem 13. April 2016 kann ein Analyzer-Knoten mit einem MediaStreamAudioSourceNode verwendet werden, um Audiopegel zu erhalten. Der resultierende audioLevels Wert kann animiert werden oder einfach in ein html meter Element übergeben werden.

var _mediaStream = SOME_LOCAL_OR_RTP_MEDIASTREAM; 
var _audioContext = new AudioContext(); 
var _audioAnalyser = []; 
var _freqs   = []; 
var audioLevels  = [0]; 

var _audioSource   = _audioContext.createMediaStreamSource(_mediaStream); 
var _audioGain1   = _audioContext.createGain(); 
var _audioChannelSplitter = _audioContext.createChannelSplitter(_audioSource.channelCount); 

var _audioSource.connect(_audioGain1); 
var _audioGain1.connect(_audioChannelSplitter); 
var _audioGain1.connect(_audioContext.destination); 

for (let i = 0; i < _audioSource.channelCount; i++) { 
    _audioAnalyser[i]      = _audioContext.createAnalyser(); 
    _audioAnalyser[i].minDecibels   = -100; 
    _audioAnalyser[i].maxDecibels   = 0; 
    _audioAnalyser[i].smoothingTimeConstant = 0.8; 
    _audioAnalyser[i].fftSize    = 32; 
    _freqs[i]        = new Uint8Array(_audioAnalyser[i].frequencyBinCount); 

    _audioChannelSplitter.connect(_audioAnalyser[i], i, 0); 
} 

function calculateAudioLevels() { 
    setTimeout(() => { 
     for (let channelI = 0; channelI < _audioAnalyser.length; channelI++) { 
      _audioAnalyser[channelI].getByteFrequencyData(_freqs[channelI]); 
      let value = 0; 
      for (let freqBinI = 0; freqBinI < _audioAnalyser[channelI].frequencyBinCount; freqBinI++) { 
       value = Math.max(value, _freqs[channelI][freqBinI]); 
      } 
      audioLevels[channelI] = value/256; 
     } 
     requestAnimationFrame(calculateAudioLevels.bind(this)); 
    }, 1000/15); // Max 15fps — not more needed 
} 

Answer 2

In JavaScript ist das der einzige Weg zu erreichen, was Sie wollen.