How to play audio in Background Mode?

[andreasotto]

What is the correct way of playing audible content in background?
I'm playing an mp3 in a loop - but as soon as the phone's screen locks, the sound will be stopped.

On Ionic i used the plugin "BackgroundMode" which works perfectly: the sound keeps on playing.

How can that be achived with NativeScript audio?

[NathanWalker]

@andreasotto for iOS, you need to add this to App_Resources/iOS/Info.plist:

<key>UIBackgroundModes</key>
<array>
  <string>audio</string>
  <string>fetch</string>
</array>

Just audio should be fine but go ahead and add fetch for good measure.

On Android I don't think you need anything.

[andreasotto]

Thank you for your response. I already set the audio key in the UIBackgroundModes array, without any success. As soon as i press the Home Button, the audio fades out to silence. It resumes when i unlock the phone again. I wonder what the difference is between the Ionic-Approach with the backgroundmode-plugin.....

[bradmartin]

Android requires the media controller to be ran from a service. Currently it's not set this way. Its possible but would require a little bit of work to refactor a few things to make sure this is done correctly. I'll see if I can get to it in the next week or two. Definitely open to PRs though :)

[Freshchris01]

Ist this already available?

[prolink007]

This seems to be working on android. I can lock phone and it keeps playing.

[prolink007]

This seems to be working on android. I can lock phone and it keeps playing.

[haneefkt]

Any progress on iOS side ? Ionic 'Background Mode' plugin like behaviour?

[stefalda]

Hi,
I've solved this problem by declaring the AUDIO CATEGORY:

//Without this call background mode doesn't work... let setCategoryRes = AVAudioSession.sharedInstance().setCategoryWithOptionsError( AVAudioSessionCategoryPlayAndRecord, AVAudioSessionCategoryOptions.DefaultToSpeaker);

[bradmartin]

Different things can be meant by "background" here. The plugin should continue playing if you lock the device screen or minimize the app. If you want a media session with background controls like Spotify (other audio apps) this plugin does not currently support that. It is possible to extend this plugin with that behavior and I have done so but the work is not open source at the moment.

[karthiksbhat]

@bradmartin Is there a way to explicitly prevent the plugin from continuing playing if the screen is locked or the app minimized? I tried to find an open/closed issue for this and only for #107 which came close.
Thanks!

[digitalhurricane-io]

Any plans to open source that code brad? (background audio controls)

[germania]

Hi,
I've solved this problem by declaring the AUDIO CATEGORY:

//Without this call background mode doesn't work... let setCategoryRes = AVAudioSession.sharedInstance().setCategoryWithOptionsError( AVAudioSessionCategoryPlayAndRecord, AVAudioSessionCategoryOptions.DefaultToSpeaker);

Working with nativescript-vue, I had to add this to my main.js for it to work. It did not work in the created hook of a component.

[kdmakwana43]

AVAudioSessionCategoryPlayAndRecord

Where can I add these changes?

[FlawaCLV]

@kdmakwana43 did you manage to make it work? @germania can you give more detail on your code? Where does setCategoryRes variable come from? Is AVAudioSession defined for iOS by default?

As you can see, I have some questions 🙂

[germania]

@kdmakwana43 did you manage to make it work? @germania can you give more detail on your code? Where does setCategoryRes variable come from? Is AVAudioSession defined for iOS by default?

As you can see, I have some questions 🙂

Below is my main.js, I haven't worked on this project in several months, but it worked when I did. Hope this helps!

import App from './components/App'
import VueDevtools from 'nativescript-vue-devtools'

if(TNS_ENV !== 'production') {
  Vue.use(VueDevtools)
}
// Prints Vue logs when --env.production is *NOT* set while building
Vue.config.silent = (TNS_ENV === 'production')

AVAudioSession.sharedInstance().setCategoryWithOptionsError(
  AVAudioSessionCategoryPlayAndRecord,
  AVAudioSessionCategoryOptions.DefaultToSpeaker
);

new Vue({
  render: h => h('frame', [h(App)])
}).$start()```

[FlawaCLV]

@germania thanks for your response! Does it work for Android as well?

[rigor789]

@FlawaCLV no, that code is only for iOS. If you are compiling an android app, you will need to wrap that code in an if statement, to only run on iOS.

Background audio is difficult on android, I've had to deal with it in a native app before (in Java), and it took weeks to figure everything out (so that it works across all devices, and has media buttons in a notification to control the playback).

Here's the section that covers some of it https://developer.android.com/guide/topics/media/mediaplayer#mpandservices

[mehdinourollah]

It's working on iOS simulator but NOT on real device . Could anyone tell why ?

[bipinbipin]

Different things can be meant by "background" here. The plugin should continue playing if you lock the device screen or minimize the app. If you want a media session with background controls like Spotify (other audio apps) this plugin does not currently support that. It is possible to extend this plugin with that behavior and I have done so but the work is not open source at the moment.

@bradmartin do you offer this plugin for purchase?

[FlawaCLV]

@mehdinourollah @bipinbipin have you guys found a solution ? My iOS users are really getting pissed off by this 😅

[FlawaCLV]

@bradmartin I confirm that the audio stops playing if the user lock the device. Any updates on this issue ?

[FlawaCLV]

Good news ! I finally managed to make it work! The solution was to add this code to my iOS Delegate 🙂

MyDelegate.prototype.applicationDidEnterBackground = function (application) {
    AVAudioSession.sharedInstance().setCategoryWithOptionsError(
        AVAudioSessionCategoryPlayAndRecord,
        AVAudioSessionCategoryOptions.DefaultToSpeaker
    );
};

[Bxggi3]

@FlawaCLV

Good news ! I finally managed to make it work! The solution was to add this code to my iOS Delegate 🙂

MyDelegate.prototype.applicationDidEnterBackground = function (application) {
    AVAudioSession.sharedInstance().setCategoryWithOptionsError(
        AVAudioSessionCategoryPlayAndRecord,
        AVAudioSessionCategoryOptions.DefaultToSpeaker
    );
};

where did you add this?

[FlawaCLV]

@Bxggi3 I've added it in the App.vue component which is my root component.

You need to create a custom delegate and set it: application.ios.delegate = MyDelegate;

[eloiqs]

@FlawaCLV Do you have any other code preventing the audio from dropping before applicationDidEnterBackground gets called?

[FlawaCLV]

@eloiqs nope, I don't believe so.

[liamcharmer]

AVAudioSession.sharedInstance().setCategoryWithOptionsError(
AVAudioSessionCategoryPlayAndRecord,
AVAudioSessionCategoryOptions.DefaultToSpeaker
);

Was something like this ever integrated into this audio plugin? (Having a MediaPlayer in notification tray)

[liamcharmer]

Also found
UIApplication.sharedApplication.beginReceivingRemoteControlEvents(); will atleast show a remote control. But doesnt configure the button presses etc.