cordova-plugin-background-mode icon indicating copy to clipboard operation
cordova-plugin-background-mode copied to clipboard

Keep youtube iframe video playing when app is in background

Open Topiya opened this issue 4 years ago • 10 comments

In Ionic 5, Is there a way to keep playing youtube iframe video when we put app in background. Because when app goes to background the iframe video gets paused.

I am enabling background mode using this plugin, but it is not working for iframe video.

Can anyone please provide any solution to this?

Topiya avatar Sep 16 '21 05:09 Topiya

dealing with the same issue now. Audio playing but video not, seems to be no solution for this atm

keev-studio avatar Sep 18 '21 23:09 keev-studio

I've had to deal with this bug for years. The best solution I have is:

document.addEventListener("pause", () => {
    cordova.plugins.backgroundMode.disableWebViewOptimizations();
}, false);
document.addEventListener("resume", () => {
    cordova.plugins.backgroundMode.disableWebViewOptimizations();
}, false);
cordova.plugins.backgroundMode.on('activate', () => {
    cordova.plugins.backgroundMode.disableWebViewOptimizations();
});
cordova.plugins.backgroundMode.on('deactivate', () => {
    cordova.plugins.backgroundMode.disableWebViewOptimizations();
});

I don't like this solution though because the video html 5 element will fire an onpause no matter what and causes the audio to pause and play again.

It'd be nice if you could set it to alwaysDisableWebViewOptimizations(true) so it wouldn't even pause the video elements. I guess it's time to see if I can muddle my way through java and fix the issue. I'm not a very good java developer.

the7erm avatar Oct 11 '21 12:10 the7erm

@the7erm I have tried with above solution but it not working for youtube iframe.

Topiya avatar Oct 11 '21 13:10 Topiya

for me also not working for html5 video tag using mp4, tested on Android 8

keev-studio avatar Oct 12 '21 13:10 keev-studio

@the7erm I have tried with above solution but it not working for youtube iframe.

That's unfortunate. I guess when elements are in an iframe you can't because of browser security stuff. It might also be that youtube has code that forces it to pause.

the7erm avatar Oct 16 '21 15:10 the7erm

I have the same problem, have you figured it out?

mh4ck avatar Apr 09 '23 11:04 mh4ck

@mh4ck No, I did not get any solution yet.

Topiya avatar Apr 12 '23 04:04 Topiya

I managed to fix it by putting a setinterval and play youtube player api every 1s it will work fine :)

arun-commits avatar Apr 17 '23 20:04 arun-commits

I managed to fix it by putting a setinterval and play youtube player api every 1s it will work fine :)

Hi, can you please elaborate a little? Will be very helpful to others if you can provide code example, you env and/or some comments. Thank you

keev-studio avatar Apr 17 '23 20:04 keev-studio

For anyone still looking for a solution, I added an event listener for the visibility changed event and when the browser is hidden, I wait a few seconds then I force the video to play again. See below: document.addEventListener("visibilitychange", () => { if (document.hidden) { setTimeout(function () { if (player) { player.playVideo(); } }, 3000); } else { } });

philnwoha avatar Nov 08 '23 07:11 philnwoha