Facebook Javascript SDK:登录按钮未显示

时间:2011-11-17 18:11:34

标签: facebook facebook-javascript-sdk facebook-login

我最近在我的网站上添加了Facebook登录按钮,整合似乎工作正常。我遇到的唯一问题是当我退出Facebook时“登录”按钮没有出现。还有其他人有这个问题吗?

我直接使用Javascript SDK文档中的代码(https://developers.facebook.com/docs/reference/javascript):

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'YOUR_APP_ID', // App ID
      channelURL : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      oauth      : true, // enable OAuth 2.0
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>

在我的页面上有这个元素:

<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="1">Login with Facebook</div>

有人看到我在这里有什么问题吗?

2 个答案:

答案 0 :(得分:3)

使用完全修剪的HTML页面测试此代码对我来说很合适。如果您没有登录Facebook,它会显示登录按钮,如果您是,则显示与您在网站上的朋友。也许你的代码的其他部分是干扰?您可以尝试使用我下面的基本HTML吗?

<html>
<head>

</head>
<body>

<div id="fb-root"></div>
<script>
    var appId = 'YOUR_APP_ID';
    var siteRoot = 'YOUR_HOST_NAME';

  window.fbAsyncInit = function() {
    FB.init({
      appId      : appId,
      channelURL : '//'+siteRoot+'/channel.html', // Channel File
      status     : true,
      cookie     : true,
      oauth      : true,
      xfbml      : true
    });
  };


  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>


<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="1">Login w/ Facebook</div>

</body>
</html>

密切相关 - 如果您想在用户登录时显示与默认值不同的内容,您可以通过以下方式检查登录状态:

FB.getLoginStatus

或者,如果您想在用户登录后执行某些操作,则可以使用以下命令绑定到登录事件:

FB.Event.subscribe('auth.login', function () {
      console.log('Hello world!');
});

答案 1 :(得分:1)

已经有一段时间了,但我怀疑你看到了这个,因为你的应用程序处于“沙盒”模式。检查您的设置。