Get audio samples from audio element

Question

I want to get live audio from a microphone using web browser and send it to a Node.js server via websockets. I am using BinaryJS library to send binary data to the server. I am having problem in getting the audio samples from the microphone. Here is what I have:

window.AudioContext = window.AudioContext || window.webkitAudioContext;

var context = new AudioContext();
var audio = document.querySelector('audio');
navigator.webkitGetUserMedia({audio: true}, function(micstream){

    audio.src = window.URL.createObjectURL(micstream);

    }, errorCallback);

});

var errorCallback = function(e){
    console.log("Rejected!", e);
};

I want some way to get the audio sample at every 10ms or so so that I can write it to the websocket stream. I am looking for something like this:

function getSample(){
    //read the current data in byte buffer.

    setTimeout(getSample, 10);
}

Can someone tell me how to do this? Or is there another way to do it? Thanks!

Answer 1

These points should get you on the right track:

• You want to send the data raw, so create a JavaScriptNode or ScriptProcessor from your context and utilize the onaudioprocess for your function. You can easily set your time intervals to make sure it is only every 10ms. This is very similar to what the current RTCRecorders do.
• The packets that are create by default are float PCM. You COULD convert them to 16 bit PCM in JavaScript but media libraries worth their weight(I know for sure Gstreamer) could translate the stream.

Here is code that I wrote. This code is just modified versions of the recorders that already exist but I send the data over a websocket and I do not modify it in javascript but the function to change from float to 16bit PCM audio is included in the source code if you need it. You could pop a time check in the onaudioprocess and move the websocket out of the worker(only Chrome supports WebSockets in Worker threads currently) and you should be good to go.