title: How to send MediaStream AUDIO data with socket.io
body: <p>I have been having trouble taking audio data that is being recorded from a mic and sending it to the other clients in the room so that people can speak to each other in real time. I have a method of doing this, but it is inefficient and choppy...</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>setInterval(() =&gt; {
      navigator.mediaDevices.getUserMedia({ audio: true })
      .then(stream =&gt; {
        const mediaRecorder = new MediaRecorder(stream);
        mediaRecorder.start();
        const audioChunks = [];
        mediaRecorder.addEventListener("dataavailable", (event) =&gt; {
          audioChunks.push(event.data);
        });
  
        mediaRecorder.addEventListener("stop", () =&gt; {
          socket.emit('liveAudioToServer', audioChunks)
        });
  
        setTimeout(() =&gt; {
          mediaRecorder.stop();
        },2000);
      });
    }, 2000);</code></pre>
  </div>
  </div>
  
  This snippet records audio and sends a buffer every two seconds so that the client side compiles it and plays it upon receiving the data. I know there's got to be another way to do this. I tried a different method, but just receive an error.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>  socket.on('active', () =&gt; {
      if(navigator.getUserMedia) {
        navigator.getUserMedia(
          {audio: true}, 
          function(stream) {
            const audioContext3 = new AudioContext();
            const audioSource3 = audioContext3.createMediaStreamSource(stream);
            const analyser3 = audioContext3.createAnalyser();
            audioSource3.connect(analyser3);
            analyser3.fftSize = 256;
            const bufferLength = analyser3.frequencyBinCount;
            const dataArray = new Uint8Array(bufferLength);
            function sendAudioChunks(){
                analyser3.getByteFrequencyData(dataArray);
                requestAnimationFrame(sendAudioChunks);
                socket.emit('liveAudioToServer', dataArray)
            }
            sendAudioChunks();
          },
          function(){ console.log("Error 003.")}
        );
      }</code></pre>
  </div>
  </div>
  
  Can anyone help me?</p>