获取Facebook用户数据Javascript API

Tsu*_*oku 7 javascript facebook-graph-api

出于某种原因,即使我非常确定我的代码是正确的,我也无法获得用户数据.对象没有返回某些值(例如:link,birthday,hometown等).这就是我所拥有的:

$(function () {
        FB.getLoginStatus(function(response) {
            if (response.status === 'connected') {
              basicAPIRequest();
            }
          });
    });

function basicAPIRequest() {
    FB.api('/me', 
        {fields: "id,about,age_range,picture,bio,birthday,context,email,first_name,gender,hometown,link,location,middle_name,name,timezone,website,work"}, 
        function(response) {
          console.log('API response', response);
          $("#fb-profile-picture").append('<img src="' + response.picture.data.url + '"> ');
          $("#name").append(response.name);
          $("#user-id").append(response.id);
          $("#work").append(response.gender);
          $("#birthday").append(response.birthday);
          $("#education").append(response.hometown);
        }
    );
  }
Run Code Online (Sandbox Code Playgroud)

the*_*eat 9

您需要请求访问这些值的权限

基本上,您的登录按钮应具有必要的数据范围属性值,以询问用户的必要权限

<div class="fb-login-button" data-scope="email,user_birthday,user_hometown,user_location,user_website,user_work_history,user_about_me"
 data-max-rows="1" data-size="medium" data-show-faces="false" data-auto-logout-link="false"></div>
Run Code Online (Sandbox Code Playgroud)

下面的示例代码,只需填写您的Facebook API ID即可

<html>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : yourappid,
      xfbml      : true,
      version    : 'v2.0'
    });
  };

  (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/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));


function basicAPIRequest() {
    FB.api('/me', 
        {fields: "id,about,age_range,picture,bio,birthday,context,email,first_name,gender,hometown,link,location,middle_name,name,timezone,website,work"}, 
        function(response) {
          console.log('API response', response);
          $("#fb-profile-picture").append('<img src="' + response.picture.data.url + '"> ');
          $("#name").append(response.name);
          $("#user-id").append(response.id);
          $("#work").append(response.gender);
          $("#birthday").append(response.birthday);
          $("#education").append(response.hometown);
        }
    );
  }
jQuery(document).ready(function(){
  jQuery("#load").click(function(e){
    if(typeof(FB) == "undefined") {
        alert("Facebook SDK not yet loaded please wait.")
      }
    FB.getLoginStatus(function(response) {
      if (response.status === 'connected') {
        console.log('Logged in.');
        basicAPIRequest();

      }
      else {
        FB.login();
      }
    });      
  });

});
</script>
fb-profile-picture: <div id="fb-profile-picture"></div>
name: <div id="name"></div>
user-id: <div id="user-id"></div>
work: <div id="work"></div>
birthday: <div id="birthday"></div>
education: <div id="education"></div>

<p>1) Click login</p>
<div class="fb-login-button" data-scope="email,user_birthday,user_hometown,user_location,user_website,user_work_history,user_about_me
" data-max-rows="1" data-size="medium" data-show-faces="false" data-auto-logout-link="false"></div>
<p>2) Click load data</p>
<button id='load'>Load data</button>
</html>
Run Code Online (Sandbox Code Playgroud)