Locked frame with source "https://www.youtube.com" from accessing frame with source "file: //"

I have a youtube url:

<iframe class="embed-responsive-item" ng-src="https://www.youtube.com/embed/s7gJ74ARN84" allowfullscreen=""></iframe>

      

If I use this in my local html file it plays well. But when I insert the same in the phone hap phonegap html app page and run it in ios simulator, it shows below error as soon as I click video:

Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "file://".  

The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "file". Protocols must match.

      

Decision:

It didn't work in the simulator, it worked on mobile devices and that was my ultimate goal.

+6


source to share


4 answers


@Manish,

You seem to have a CORS problem . You can add to config.xml <access origin="*"/>

.



Jessie

0


source


@Manish, since you've already dealt with the CORS problem, the error you are getting says:

The frame access request has the "https" protocol, and the accessed frame has the "file" protocol. Protocols must match.



Since it's not CORS, have you gotten rid of the iframe? If that works, you might need a hidden one <div>

.

Jessie

0


source


Make sure you have installed cordova-plugin-whitelist

And on config.xml add this line

<!-- Whitelist the domain -->
<allow-navigation href="https://*youtube.com/*"/>

      

You can use this if you want to whitelist all URLs
But you have to be careful, if your application can be injected by a script, it will be a security hole

<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />

      

0


source


Hey this is a very small problem

Your link: => " https://www.youtube.com/embed/s7gJ74ARN84 "

But you just need to change it to

this link "//www.youtube.com/embed/s7gJ74ARN84"

Remember, when you are trying to load protected content on your site, just remove the protocol from the link

-3


source







All Articles