Cordova Media Plugin breaks HTML5 Audio tag on iOS

Question

I am working on an Ionic Application and now facing a curious issue.

On a view, i can record audio. On that same view i have many HTML5 audio tags.

The audio tag works well until i launch a record. Once startRecord is executed, i can't play the HTML5 audio no more. The play button doesn't do anything. The recorded audio is well recorded and restarting my application, i can play it, as for the other audio on the page.

I don't have that problem on Android.

I do every thing well i think (i have read that on iOS you have to create the file on the filesytem using the HTML5 APi, what i did with no success), i release the media after recording (but the issue happen even before the stopRecord).

Did someone ever had that issue ? Any clue ?

Cordova : 5.1.1 Plugin Media : 1.0.2 iOS : 8.3

Regards,

Answer 1

Back with a solution.

In file cordova-plugin-media/blob/master/src/ios/CDVSound.m, apply the following patch :

// get the audioSession and set the category to allow recording when device is locked or ring/silent switch engaged
         if ([self hasAudioSession]) {
             if (![self.avSession.category isEqualToString:AVAudioSessionCategoryPlayAndRecord]) {
             -                    [self.avSession setCategory:AVAudioSessionCategoryRecord error:nil];
             +                    [self.avSession setCategory:AVAudioSessionCategoryPlayAndRecord withOptions:AVAudioSessionCategoryOptionMixWithOthers error:nil];
             }

             if (![self.avSession setActive:YES error:&error]) {

Basically while changing our AvAudioSession catagory, we have to put it in category 'Play And Record', not only 'Record' and add option 'to mix with others audio sessions'.

Hope this will help ;)

Answer 2

In addition to your fix, I've found that when you start recording, audio is sent automatically to earphones instead of speakers, making the sound low. To fix this, I also added AVAudioSessionCategoryOptionDefaultToSpeaker mask to options. This will detect automatically if you have earphones connected, if not, it will default to speakers output. The resulting code is:

[self.avSession setCategory:AVAudioSessionCategoryPlayAndRecord
  withOptions:AVAudioSessionCategoryOptionMixWithOthers |
   AVAudioSessionCategoryOptionDefaultToSpeaker error:nil];

Answer 3

Just double check you are releasing the underlying operating system's audio resources after recording. Was a simple fix for me:

my_media.release();

Answer 4

For ionic2 or higher

Replace the CDVSound.m file with this one: https://gist.github.com/malinosqui/0df4c570403b29f08f3cf1352f4b56b9 (contains @MasterKitano and @Sn00p answers)

the CDVSound.m file is located in platforms/ios/{AppName}/Plugins/cordova-plugin-media/