I'm trying to include a Vimeo video in my PhoneGap app so I added the embed code generated on Vimeo in my html page:
<iframe src="https://player.vimeo.com/video/39483020" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
I call the phonegap serve command to start a web server which hosts my project and the video plays fine when I preview on my iPad Safari browser visiting the server address generated.
However it doesn't show up at all (blank iframe) when I try to preview it using the PhoneGap Developer iOS app on my iPad.
I tried white-listing vimeo in the config.xml file but it didn't seem to have any effect:
<access origin="*.vimeo.com" />
<access origin="*.vimeocdn.com" />
<allow-intent href="*.vimeo.com" />
<allow-intent href="*.vimeocdn.com" />
<allow-navigation href="*.vimeo.com" />
<allow-navigation href="*.vimeocdn.com" />
I also tried including these domains in the Content Security Policy with no luck:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: 'unsafe-inline' https://*.vimeo.com https://*.vimeocdn.com https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *" />
Would appreciate any advice on how to make it work on iPad.