Converting WAV to any compressed audio format in client-side JavaScript

Question

I am recording audio from getUserMedia({audio:true}); in the browser using Recorder.js and then exporting it as a WAV file because that\'s the only option the l

Answer 1

I had a similar issue (also using recorder.js) and have managed to resolve using the superb videoconverter.js project which includes a port of ffmpeg to Javascript using emscripen. Downside to this is the ffmpeg.js file is about 25Mb.

I modified the existing exportWAV function in recorderWorker.js to return both a WAV (for HTML5 <audio> playback) and a Blob containing an encoded MP2 file:

function encodeWAV(samples) {

  var buffer = new ArrayBuffer(44 + samples.length * 2);
  var view = new DataView(buffer);

  /* ... various writing methods */

  return { wavdata: new Blob([buffer], { type: "audio/wav" }), mp2data: ffmpeg_convert(buffer) };
}

function ffmpeg_convert(buffer) {
    console.log("starting mp2 conversion");
    var args = "-i input -f mp2 output.mp2";
    var results = ffmpeg_run({
        arguments: args.split(" "),
        files: [
          {
              data: new Uint8Array(buffer),
              "name": "input"
          }
        ]
    });
    if (results) {
        var file = results[0];
        console.log("File recieved", file.name, file.data);
        return new Blob([file.data], { type: "audio/mpeg" });
    }
    return null;
}

This method can be used to encode the WAV to any codec suppored by ffmpeg's libavcodec

Answer 2

What you really want is the mediaStream "Recording API", which is currently being worked on. Until that's available, I advise using emscriptem on C/C++ source, and consider running it in a webworker to avoid blocking the UI and other tabs.

Answer 3

I was facing the same problem and came up with quite a quick and dirty solution:

• zip the wav-file with zip.js (works with Chrome, Firefox, Safari 6 and Internet Explorer 10)

Further intel see Documentation zip.js

At least this is reducing size a lot, file is about >75% smaller so 1:4 compression

UPDATE: Maybe have a look at this: https://webrtc.github.io/samples/

It is a Chat Application for Chrome and Firefox developed by google, I assume with kind of CC-License

Answer 4

I've made an audio recorder that records to mp3 directly from the browser combining RecorderJS and libmp3lame.js

You can find the gitHub project here: https://github.com/nusofthq/Recordmp3js

and a more detailed explanation of the implementation: http://nusofthq.com/blog/recording-mp3-using-only-html5-and-javascript-recordmp3-js/

Answer 5

I was able to achieve compression using opus.js,

you can find my implementation here: recordOpus, but there is a catch, mine is coupled with server-side, and I use node.js server....