The website I'm working on has a Facebook login option, but recently a user reported it wasn't working for them. I disabled my extensions etc, I got this error in my console:
Blocked a frame with origin "https://www.facebook.com" from accessing a frame
with origin "http://static.ak.facebook.com". The frame requesting access has
a protocol of "https", the frame being accessed has a protocol of "http".
Protocols must match.
Is there an option I can feed to the API that will get it to work on the same protocols? FYI, the primary website runs on HTTP (no S).
It is especially odd because it seems like it stopped working all of a sudden (but it is possible this was always a problem as I am new and am learning this system).
I have this code at the foot of my page:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : ..., // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
channel: '//...mychannel.../channel'
});
FB.Event.subscribe('auth.authResponseChange', function(fbResponse) {
// function that logs in user
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
If you are not loading the javascript sdk async, you could see this error a lot.
refer to: https://developers.facebook.com/docs/javascript/quickstart
in addition, if you are using any Facebook plugins via the iframe code, be sure the src url protocol matches.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the app dashboard
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel file for x-domain comms
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK asynchronously
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>