Embedded videos don't work on mobile app

Hi Guys,

I am trying to embed youtube and vimeo vidoes into my app. While this works fine on the web browser, it doesn’t work on the android build. I have tired everything and looked everywhere but have so far found nothing that would help me figure out why this is.

I have added to the config.xml file of the project. I also have used $sce to whitelist the embed URLs.

This is my code

In the controller:
$scope.url = $sce.trustAsUrl('https://player.vimeo.com/video/266866465?autoplay=1&title=0&byline=0');

In the HTML:
<iframe src="{{url}}" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen sandbox="allow-same-origin"></iframe>

Can anyone please tell me why the videos won’t play on the mobile app but they do on the web app? Is it because of cookies? If so, how are others displaying third party hosted videos on their apps?

Bump!

I really need help with this ASAP. Any insight into the matter would be much appreciated.

Try adding the following to your config.xml

<preference name="AllowInlineMediaPlayback" value="true" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />   
<allow-navigation href="*vimeo*" />

Hi Sourav,

Thanks for the reply. I tried adding those params to the config.xml and then taking a build but the issue is still the same. The loader on the vimeo player just keeps spinning infinitely without the video ever loading. Is there any chance that you have an example repo that I could pull and take a build off of to see it in action?