Facebook Login API HTTPS Issue

Question

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> 

Answer 1

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>