Ionic Android - Music player stops working after few minutes

Although there are many tutorials on building music players, such as THIS one, none are currently working for android when the phone is locked. I’ve tried Native Audio with Media Session to
have a foreground service that plays the audio and has Audio Controls in the notification bar. HERE is my Ionic project.

The audio plays correctly, buttons work fine, and progress bar is updated, but check out this method inside my smart-audio.service.ts

setMediaSessionPosition() {
    if(this.mediaProgressTimeout) {
      clearTimeout(this.mediaProgressTimeout);
    }

    this.position().then(secs => {
      if(this.active && this.active.status == "playing") {
        let duration = this.active.mediaObj.getDuration();
        if(!isNaN(duration)) {
          this.ending = duration - secs < 5;
          MediaSession.setPositionState({
            duration: duration,
            playbackRate: 1,
            position: secs
          });
        }
      }
    });
    this.mediaProgressTimeout = setTimeout(() => {
      if(this.active)
        this.setMediaSessionPosition();
    }, 1000);
  }

As you can see, this method recursively calls itself every 1 second to update the status bar. When I lock my phone, it still works for a few minutes, but then instead of 1 second, it calls itself after 2 seconds, 3 seconds, then it is never called again, as if my app’s process was put on a permanent sleep.

When that happens, not only the progress bar stops being updated, but also the media buttons (Previous track, Next track, Pause) are unresponsive. The audio is played until it ends, but the next track is never played because my app is asleep. Even with Wakelocks being requested everytime that timeout method is called.

I’ve tried Wakelocks, I’ve checked the android permissions on Foreground Service, Background Service, everything, I’ve checked the broadcast receiver on android manifest for those media buttons, and everything seems correct.

My app, just like Spotify, needs to play audio indefinately even with the phone locked. Why on Earth is my app being put to sleep even with foreground service and how can I prevent it?

P.S.: 90% of Ionic’s plugins had their last commit 4 years ago or more. Are Ionic plugins dead?

Hi,

I’ve faced a similar issue before. The app is running…The webview itself is asleep.

It seems that after a few minutes in the background, the JS event loop will ignore any new scheduled tasks.

What I did to work around that is have a native timer and send a message from it to the webview directly. Hopefully that should work in your case.

It’s kinda complicated right?

For playing audio, I think that the most reliable that I found until now was the cordova-plugin-media , and it’s severely outdated too.

For audio to continue playing on Android after the device sleeps, you have to use a foreground service. I ended up creating my own Capacitor plugin because nothing that existed worked for my specific use case.

I just posted over here with my example code for a custom audio player plugin - Audio in the background for Ionic / Capacitor app - #12 by twestrick

The solution for ensuring audio playback continues on Android even when the device sleeps, and the reason a Capacitor plugin was created, [mzansinow mp3] was to address the issue of interruptions to audio playback caused by device sleep on Android platforms.