0

在 Facebook 连接到我的网络应用程序后，如何编辑以下代码以显示 Facebook 昵称或个人资料图片？

它目前工作正常，但登录后，登录按钮消失，没有显示 Facebook 用户信息。 

<script src="//connect.facebook.net/en_US/all.js"></script>

<script type="text/javascript">

  // Initialize the Facebook JavaScript SDK
  FB.init({
    appId: 'APP_ID',
    xfbml: true,
    status: true,
    cookie: true,
  });

  // Check if the current user is logged in and has authorized the app
  FB.getLoginStatus(checkLoginStatus);

  // Login in the current user via Facebook and ask for email permission
  function authUser() {
    FB.login(checkLoginStatus, {scope:'email'});
  }

  // Check the result of the user status and display login button if necessary
  function checkLoginStatus(response) {
    if(response && response.status == 'connected') {
      alert('User is authorized');

      // Hide the login button
      document.getElementById('loginButton').style.display = 'none';

      // Now Personalize the User Experience
      console.log('Access Token: ' + response.authResponse.accessToken);
    } else {
      alert('User is not authorized');

      // Display the login button
      document.getElementById('loginButton').style.display = 'block';
    }
  }
</script>

<input id="loginButton" type="button" value="Login!" onclick="authUser();" />
4

2 回答 2

1 
<script type="text/javascript">

  // Initialize the Facebook JavaScript SDK
  FB.init({
    appId: '<APPID>',
    xfbml: true,
    status: true,
    cookie: true,
  });

  // Check if the current user is logged in and has authorized the app
  FB.getLoginStatus(checkLoginStatus);

  // Login in the current user via Facebook and ask for email permission
  function authUser() {
    FB.login(checkLoginStatus, {scope:'email'});
  }

function logout() {
FB.logout(function(response) {
  // user is now logged out
});

}

  // Check the result of the user status and display login button if necessary
  function checkLoginStatus(response) {
    if(response && response.status == 'connected') {
      alert('User is authorized');
      var userInfo = document.getElementById('user-info');
        FB.api('/me', function(response) {
        userInfo.innerHTML = '<img src="https://graph.facebook.com/' + response.id + '/picture">' + response.name;
        });i

      // Hide the login button
      document.getElementById('loginButton').style.display = 'none';

      // Now Personalize the User Experience
      console.log('Access Token: ' + response.authResponse.accessToken);
    } else {
      alert('User is not authorized');

      // Display the login button
      document.getElementById('loginButton').style.display = 'block';
    }
  }
</script>

<input id="loginButton" type="button" value="Login!" onclick="authUser();" />
<input id="logoutButton" type="button" value="Logout!" onclick="logout();" />
<div id="user-info"></div>
于 2012-11-05T13:03:46.637 回答
0

我想你就快到了！而不是警告“用户已授权”，您可以拥有以下内容：

var userInfo = document.getElementById('user-info');

FB.api('/me', function(response) { userInfo.innerHTML = '<img src="https://graph.facebook.com/' + response.id + '/picture">' +
response.name;

});

然后只需在您的登录按钮下创建一个 div：

<div id="user-info"></div>

于 2012-10-31T11:55:15.933 回答