Phonegap Media record mp3 file corrupt

Question

I am using phonegap media to record audio as mp3. After recording, it plays fine on my Android and plays fine on Windows Media Player. However, when I try it in the browser it says that the file is corrupt.

Exact errors:

Chrome: "We cannot play this audio file right now."

Firefox: "Video can't be played because the file is corrupt."

IE: Opens the file in WMP and it plays.

I used the code from the example. http://docs.phonegap.com/en/2.6.0/cordova_media_media.md.html#media.startRecord

// Record audio
// 
function recordAudio() {
    var src = "myrecording.mp3";
    var mediaRec = new Media(src,
        // success callback
        function() {
            console.log("recordAudio():Audio Success");
        },

        // error callback
        function(err) {
            console.log("recordAudio():Audio Error: "+ err.code);
        });

    // Record audio
    mediaRec.startRecord();
}

Thanks in advance.

Edit:

Here is an example. http://blrbrdev.azurewebsites.net/voice/blrbr_130419951008830874.mp3 This plays in WMP but not the browser.

Answer 1

The file you provided as an mp3 does not appear to be an mp3 file. I have attached below the details of the file. As you can see it is AMR codec packed in a MPEG-4/3GPP container. I would say no current browser can decode that natively (but software like VLC can play it back).

If you are attempting to play an audio file in a browser - be it HTML5 audio for say - you need to provide a compatible format. Have a look here for a compatibility table.

This is expected behavior as stated here:

Android devices record audio in Adaptive Multi-Rate format. The specified file should end with a .amr extension.

If you want to play it in a browser/HTML5 audio tag you would need to post process the file to convert it to a valid mp3 file (add ogg audio for full browser coverage). Server side this can be done with a program called ffmpeg for example. I am no specialist of Phonegap development so I cannot point you to a valid lib that does that client side but maybe this has already been asked on SO.

File specs:

General 
Complete name : C:\wamp\www\stack\sample\thisTest.mp3  
Format : MPEG-4 
Format profile : 3GPP Media Release 4 
Codec ID : 3gp4 
File size : 10.5 KiB 
Duration : 4s 780ms 
Overall bit rate mode : Constant 
Overall bit rate : 18.0 Kbps 
Performer : LGE 
Encoded date : UTC 2014-04-15 00:24:57 
Tagged date : UTC 2014-04-15 00:24:57 

Audio 
ID : 1 
Format : AMR 
Format/Info : Adaptive Multi-Rate 
Format profile : Narrow band 
Codec ID : samr 
Duration : 4s 780ms 
Bit rate mode : Constant 
Bit rate : 12.8 Kbps 
Channel(s) : 1 channel 
Sampling rate : 8 000 Hz 
Bit depth : 13 bits 
Stream size : 7.47 KiB (71%) 
Title : SoundHandle 
Writing library :  
Language : English 
Encoded date : UTC 2014-04-15 00:24:57 
Tagged date : UTC 2014-04-15 00:24:57 

Answer 2

Firstly thanks to @Forestan06 for pointing me in the right direction.

For those of you recording on Android devices in .amr format and needing said recording in .mp3 format on your server using .Net C#, this is how I did it.

1. Install-Package MediaToolkit --> http://www.nuget.org/packages/MediaToolkit/

2. Write this code:

   var fileName ="myVoice.mp3";
   string fileNameWithPath = Server.MapPath("~/Voice/" + fileName);
   
   if (request.FileName.EndsWith(".amr"))
   {
       var amrFileName = "myVoice.amr";
       string amrFileNameWithPath = Server.MapPath("~/Voice/Amr/" + amrFileName);
       request.SaveAs(amrFileNameWithPath);
   
       var inputFile = new MediaFile { Filename = amrFileNameWithPath };
       var outputFile = new MediaFile { Filename = fileNameWithPath };
   
       using (var engine = new Engine())
       {
           engine.Convert(inputFile, outputFile);
       }
   
   }
   else
   {
       request.SaveAs(fileNameWithPath);
   }