html - convert wav to mp3 using javascript

Question

Below is a code, I would like to convert wav format to mp3. Refereed to Record.js. But it is going over my head. Can anyone solve this? (View consists of empty DataView i.e, DataView {})

var blob = new Blob ( [ view ], { type : 'audio/wav' } );

    // let's save it locally
    outputElement.innerHTML = 'Handing off the file now...';
    var url = (window.URL || window.webkitURL).createObjectURL(blob);
    var link = window.document.createElement('a');
    link.href = url;
    link.download = 'output.wav';
    var click = document.createEvent("Event");
    click.initEvent("click", true, true);
    link.dispatchEvent(click);
    audioplayer.src = url;

Answer 1

You can use Recordmp3js since it will give the mp3 audio directly.

If you want to understand it, I implemented a very simple version here. Notice that the wavs converted with this implementation need to be mono or the result will be messy.

var convert = function(){
    var arrayBuffer = this.result;
    var buffer = new Uint8Array(arrayBuffer);
  
    data = parseWav(buffer);

    var config = {
      mode : 3,
      channels:1,
      samplerate: data.sampleRate,
      bitrate: data.bitsPerSample
    };

    var mp3codec = Lame.init();
    Lame.set_mode(mp3codec, config.mode || Lame.JOINT_STEREO);
    Lame.set_num_channels(mp3codec, config.channels || 2);
    Lame.set_num_samples(mp3codec, config.samples || -1);
    Lame.set_in_samplerate(mp3codec, config.samplerate || 44100);
    Lame.set_out_samplerate(mp3codec, config.samplerate || 44100);
    Lame.set_bitrate(mp3codec, config.bitrate || 128);    
    Lame.init_params(mp3codec);

    var array = Uint8ArrayToFloat32Array(data.samples);

    var mp3data = Lame.encode_buffer_ieee_float(mp3codec, array, array);

    var url = 'data:audio/mp3;base64,'+encode64(mp3data.data);
    convertedPlayer.src = url;
    convertedLink.href = url;
  
    var name = file.name.substr(0, file.name.lastIndexOf('.'));
    convertedLink.textContent = name + '.mp3';
    
    converted.style.display = 'block';
    
    Lame.encode_flush(mp3codec);
    Lame.close(mp3codec);
    mp3codec = null;
};

• Read more about recordmp3-js
• Read more about Wav