Skip to main content
 首页 » 编程设计

facebook-javascript-sdk之Facebook 登录 API HTTPS 问题

2024年09月07日83bhlsheji

我正在开发的网站有一个 Facebook 登录选项,但最近有用户报告说它不适合他们。我禁用了我的扩展等,我在控制台中收到了这个错误:

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. 

有没有我可以提供给 API 的选项,让它在相同的协议(protocol)上工作?仅供引用,主要网站在 HTTP(无 S)上运行。

这特别奇怪,因为它似乎突然停止工作(但这可能一直是一个问题,因为我是新手并且正在学习这个系统)。

我的页面底部有这段代码:
<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> 

请您参考如下方法:

如果您没有加载 javascript sdk 异步,您可能会经常看到此错误。

引用:https://developers.facebook.com/docs/javascript/quickstart

此外,如果您通过 iframe 代码使用任何 Facebook 插件,请确保 src url 协议(protocol)匹配。

<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>