Facebook喜欢按钮https问题:来自http和https的协议不匹配

Als*_*ton 9 facebook facebook-like

我正在运行与此非常类似的错误:Facebook登录API HTTPS问题.

I have a website use facebook authentication, the Facebook login is no problem. But the Facebook like-button get troubled when been clicked (test fail on Chrome, Safari, Firefox, in OSX), the error message is:

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.
Run Code Online (Sandbox Code Playgroud)

I've searched all over and find no solutions.

It seems like that when the like-button is clicked, it pop out a frame from https://facebook.com callback and trying to request http://static.ak.facebook.com thus cause protocol mismatch?!

Here's what I put right after <body> tag

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    // init the FB JS SDK
    FB.init({
      appId      : 'appid',                        // App ID from the app dashboard
      channelUrl : '//mydomain/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/zh_TW/all.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
Run Code Online (Sandbox Code Playgroud)

and the channel file at http://mydomain/channel

<script src="//connect.facebook.net/zh_TW/all.js"></script>
Run Code Online (Sandbox Code Playgroud)

and here's how I use the like-button

<div class="fb-like" data-href=url data-send="true" data-width="450"
data-show-faces="true"></div>
Run Code Online (Sandbox Code Playgroud)

Really needs help, please!

ste*_*eve 4

在您的第一个脚本标签中,您可以明确告诉 Facebook 使用 HTTPS...

添加行:

FB._https = (window.location.protocol == "https:");
Run Code Online (Sandbox Code Playgroud)

将其添加在 FB.init 函数调用之前,位于注释下方或注释位置:

// init the FB JS SDK
Run Code Online (Sandbox Code Playgroud)

这将确保 Facebook 的服务器通过 https 加载任何所需的库。

希望这可以帮助。