Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML5 Recording audio with low kbps

I did a audio recorder using the getUserMedia(). And saving the file using the Recorder.js

But the output file is far heavier than I'd like it was.

A 4 minutes audio record have something like 40mb. And i can't send it to my server. If so,it will crash.

So, I searched how to reduce the recording kbps. But I found nothing. Just some Flash solutions. But these don't fit to my project.

So, my question is, is possible to reduce the kbps of a audio record using the getUserMedia() ?

like image 818
João Mosmann Avatar asked Aug 21 '13 04:08

João Mosmann


1 Answers

In my case Chrome records audio at 96kHz and Firefox at 44.1kHz, that makes huge WAV files. I implemented a downsampling function inside recorderWorker.js where you can select the sample ratio you want, like 16000.

function downsampleBuffer(buffer, rate) {
    if (rate == sampleRate) {
        return buffer;
    }
    if (rate > sampleRate) {
        throw "downsampling rate show be smaller than original sample rate";
    }
    var sampleRateRatio = sampleRate / rate;
    var newLength = Math.round(buffer.length / sampleRateRatio);
    var result = new Float32Array(newLength);
    var offsetResult = 0;
    var offsetBuffer = 0;
    while (offsetResult < result.length) {
        var nextOffsetBuffer = Math.round((offsetResult + 1) * sampleRateRatio);
        var accum = 0, count = 0;
        for (var i = offsetBuffer; i < nextOffsetBuffer && i < buffer.length; i++) {
            accum += buffer[i];
            count++;
        }
        result[offsetResult] = accum / count;
        offsetResult++;
        offsetBuffer = nextOffsetBuffer;
    }
    return result;
}

and i call it when exporting the wav file:

function exportWAV(rate, type) {
    var bufferL = mergeBuffers(recBuffersL, recLength);
    var bufferR = mergeBuffers(recBuffersR, recLength);
    var interleaved = interleave(bufferL, bufferR);
    var downsampledBuffer = downsampleBuffer(interleaved, rate);
    var dataview = encodeWAV(rate, downsampledBuffer, false);
    var audioBlob = new Blob([ dataview ], {
        type : type
    });

    this.postMessage(audioBlob);
}
like image 140
ciri-cuervo Avatar answered Sep 30 '22 13:09

ciri-cuervo