Play Ionic/Cordova media in background

Question

I'm starting with Ionic 4 and I try to create and app which can play media(streams) like youtube in the background. I used the Ionic Youtube Video Player and Background Mode like this in my home.page.ts:

import { Component } from '@angular/core';

import { YoutubeVideoPlayer } from '@ionic-native/youtube-video-player/ngx';
import { BackgroundMode } from '@ionic-native/background-mode/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor(
    private youtube: YoutubeVideoPlayer,
    private backgroundMode: BackgroundMode
    ) {
  }

  openMyVideo(id:string) {

    this.backgroundMode.on("activate").subscribe(() => {
      this.backgroundMode.disableWebViewOptimizations();
    });

    this.backgroundMode.on("enable").subscribe(() => {
      this.youtube.openVideo(id);
    });

    this.backgroundMode.enable();
  }

}

And this is my home.page.html:

<ion-header>
  <ion-toolbar>
    <ion-title>
      YouTube Player
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>

  <ion-button (click)="openMyVideo('xxxxxxxxxxx')">Open Video</ion-button>

</ion-content>

It works so far, but the video stops when I lock my screen (iOS and Andriod), but I'd like to keep it playing. Is their something I'm missing or do I have to embed the video or something? Is it even possible at all..?

Thanks in advance for the help!

Play Ionic/Cordova media in background

0 Answers0