How can I get Get friends list from Facebook API using Javascript in a jsp file

Question

I am trying to get a user basic profile and friends list like(friendId, freindName, etc) when he logged into my site. But for now am getting the basic profile and my Problem now is to get the friends list and display it.

Here is my code

<body>
    <script>
      // This is called with the results from from FB.getLoginStatus().
      function statusChangeCallback(response) {
        console.log(response);
        if (response.status === 'connected') {
          // Logged into your app and Facebook.
          testAPI();
        } else if (response.status === 'not_authorized') {
          // The person is logged into Facebook, but not your app.
          document.getElementById('status').innerHTML = 'Please log ' +  'into this app.';
        } else {

          document.getElementById('status').innerHTML = 'Please log ' +  'into Facebook.';
        }
      }

      // This function is called when someone finishes with the Login
      // Button.  See the onlogin handler attached to it in the sample
      // code below.
      function checkLoginState() {
        FB.getLoginStatus(function(response) {
          statusChangeCallback(response);
        });
      }

      //this is to initialize the 
      window.fbAsyncInit = function() {
      FB.init({
        appId      : 'my_app_id',
        cookie     : true,  // enable cookies to allow the server to access the session
        xfbml      : true,  // parse social plugins on this page
        version    : 'v2.1' // use version 2.1
      });

      FB.getLoginStatus(function(response) {
        statusChangeCallback(response);
      });
    };

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

      // Here we run a very simple test of the Graph API after login is
      // successful.  See statusChangeCallback() for when this call is made.
      function testAPI() {
        console.log('Welcome!  Fetching your information.... ');
        FB.api('/me', function(response) {
          console.log('Successful login for: ' + response.name);
          document.getElementById('status').innerHTML =  'User id, ' + response.id + '!';
          document.getElementById('status1').innerHTML =  'User name, ' + response.name +'!';
        });

//the sort function to sort the list of friends 
        function sortMethod(a, b) {
            var x = a.name.toLowerCase();
             var y = b.name.toLowerCase();
             return ((x < y) ? -1 : ((x > y) ? 1 : 0));
         }    

     // now to get friends where my problem is found
      //var limit = 10;
      FB.api('/me/friends', function(response) {
          var result_holder = document.getElementById('result_friends');
          var friend_data = response.data.sort(sortMethod);
          var results = '';
                  for (var i = 0; i < friend_data.length; i++) {
                        results += '<div><img src="https://graph.facebook.com/' + friend_data[i].id + '/picture">' + friend_data[i].name + '</div>';
                   }
         // and display them at our holder element
             result_holder.innerHTML = '<h2>Result list of your friends:</h2>' + results;
      });

      }
    </script>
    <div class="fb-login-button" 
            scope="public_profile, email, user_friends" 
            onlogin="checkLoginState();"
            data-auto-logout-link="true">
    </div>

  // here it's working 
    <div id="status"></div> //so i get the user id
    <div id="status1"></div> //and here the user name as espected
    <div id="fb-root"></div>

   //this is to display the like button and share no problem and it also working
     <div  
        class="fb-like"  
        data-share="true" 
        data-width="450"  
        data-show-faces="true"
        data-size="large">
        </div>

   // But here nothing is displaying and nothing like error in the console
    <div id="result_friends"></div>

Please I will really appreciated anybody who can give me a hand thks in advance

Answer 1

I am dealing with the same problem. This is the result of Facebook's changes to their API. Now only friends will be in the result that are using the same App. Only for games developers there is an additional option to invite friends that are not already a known user of the same app.

This makes it very hard to grow your customer base from the start if your app is not a game.

How can I get Get friends list from Facebook API using Javascript in a jsp file

Question

1 answers

solution1
0 2015-01-05 10:46:19

How can I get Get friends list from Facebook API using Javascript in a jsp file

Question

1 answers

solution1 0 2015-01-05 10:46:19

solution1
0 2015-01-05 10:46:19