Facebook登录链接自动刷新到Facebook用户资料链接和图片

Question

我正在尝试使用重力表单使WordPress提交表单，其中访问者看到一个"Login with Facebook"按钮。

一旦访问者登录并授予权限，该部分就会刷新，显示Facebook用户个人资料链接和图片，让访问者知道他们正在使用Facebook个人资料提交。

我已经复制了代码，但我需要一些帮助来完成它。

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'XXXXXXXXXXXXXXXXX', // App ID
      channelUrl : '//www.MY-DOMAIN.com/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      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>
<script>
  FB.api('/me', function(user) {
    if (user) {
      var image = document.getElementById('image');
      image.src = 'http://graph.facebook.com/' + user.id + '/picture';
      var name = document.getElementById('name');
      name.innerHTML = user.name
    }
  });
</script>

现在，我要怎么做才能得到我可以显示"登录按钮"的部分，然后在有人登录后显示用户配置文件链接?

Answer 1

您可以使用以下方式登录:

• JavaScript SDK FB.login方法
• 登录按钮(有HTML5/XFBML/Iframe版本)

Answer 2

在页面加载中调用to API为时过早。首先，它需要在facebook脚本准备好运行后完成。您可以将代码放入fbAsyncInit()函数中。其次，你应该遵循这个范例，以确保用户登录到你的应用程序，见:https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/