Accessing Facebook friends list fails when used with JavaScript SDK

Question

I have been seeing questions on Stack Overflow to access the Facebook friends list of a user. I have tried in many different ways to do this and unfortunately nothing seems to be working for me.

Can any one tell me the exact problem I am facing? I'm totally new to javascript. Below is the code I am using

    <html>
    <head>
      <title>My Facebook Login Page</title>
    </head>
    <body>
     <div id="fb-root"></div>
     <script>
        window.fbAsyncInit = function() {
        var friends = new Array();
       FB.init({
      appId      : 'some_id', // App ID
      channelUrl : 'http://apps.facebook.com/myapp', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });

    FB.api('/me/friends', function(response) {
        if(response.data) {
            $.each(response.data,function(index,friend) {
                alert(friend.name + ' has id:' + friend.id);
            });
        } else {
            alert("Error!");
        }
    });

    };



      // 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 = "http://connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
       }(document)); 
     </script>

    <p>
        <fb:profile-pic uid='loggedinuser' facebook-logo='true'/>
    </p>
    </br>
    </br>
    "Welcome, <fb:name uid='' useyou='false'></fb:name>
    </br>

    </br>
    </br>



 </br>
 </br>

    </br></br> <fb:login-button autologoutlink="true" />

 </body>
 </html>

I am getting the response as undefined and am not able to even login to facebook. I tried using the following sample http://jobyj.in/api/get-facebook-friends-using-javascript-sdk/. This works fine with the Demo but then I downloaded it and tried to run from my machine it is also not giving me any result.

Any suggestions for me?

Update

I am using the example given by @Somnath below and able to login. But after that getting the value undefined for response.session resulting in zero friends list. Any idea for this?

Ist try to log in. Otherwise you will get undefined response. — Somnath Muluk, Jan 27 '12 at 07:00
@DMCS, I removed that line but still I have problems for login. However instead of my localhost url if I give canvas page url i.e., http://apps.facebook.com/app_name/html_page I am able to login. Not getting what the problem is — tejas, Jan 31 '12 at 03:59
is not deprecated. It is part of XFBML (not FBML) and is supported by the JS SDK today. It is also [well-documented](https://developers.facebook.com/docs/reference/plugins/fb:name/) along with fb:profile-pic and fb:login-button. — AndrewF, Dec 17 '12 at 21:29

Somnath Muluk · Answer 1 · 2012-01-31T05:38:02.097

Here is tutorial for login through javascript.

Tutorial Javascript SDK

Ist try to log in. Otherwise you will get undefined response.

FB.getLoginStatus(function(response) {
         if (response.session) {
             // logged in and connected user, someone you know
            FB.api('/me/friends', function(response) {
              if(response.data) {
               $.each(response.data,function(index,friend) {
                   alert(friend.name + ' has id:' + friend.id);
               });
              } else {
                  alert("Error!");
                  }
             });
         }
     });

You will get friend list of logged in user.

Updated Answer: Don't specify channelUrl at time of initialization. Only give only following four parameters. Try this out.

FB.init({
  appId      : 'some_id', // App ID
  status     : true, // check login status
  cookie     : true, // enable cookies to allow the server to access the session
  xfbml      : true  // parse XFBML
});

Update2: Try using fql:

if (response.session) {  

//getting current logged in user's id from session object  

 globaluserid=response.session["uid"];  

 //fetching friends uids from 'friend' table. We are using FB.api syntax  

 FB.api(  

 {  

 method: 'fql.query', 

 query: 'SELECT uid1 FROM friend WHERE uid2='+globaluserid 

 }, 

 function(response) { 

 //once we get the response of above select query we are going to parse them 

 for(i=0;i<response.length;i++) 

 { 

 //fetching name and square profile photo of each friends 

 FB.api( 

 { 

 method: 'fql.query',  

 query: 'SELECT name,pic_square FROM user WHERE uid='+response[i].uid1 

 }, 

 function(response) { 

 //creating img tag with src from response and title as friend's name  

 htmlcontent='<img src='+response[0].pic_square+' title='+response[0].name+' />';  

 //appending to div based on id. for this line we included jquery  

 $("#friendslist").append(htmlcontent);  

 }  

 );  

 }  

 }  

 );  

 } else {  

 // no user session available, someone you dont know  

 top.location.href="../kfb_login.php";  

 }

am not able to login also. I am getting Facebook API error code 191 and API Error Description: The specified URL is not owned by the application Error Message: Invalid redirect_uri: Given URL is not allowed by the Application configuration error. I have set my website url as http://192.168.100.IP:8085/ which is my localhost url and for the channel url, using the above mentioned one. But still am not able to login — tejas, Jan 27 '12 at 07:16
i tried, but still not able to login. Are there are any extra settings I need to concentrate for the app? I have set the normal configurations — tejas, Jan 27 '12 at 10:11
I logged in now finally, but this is not giving me friends list unfortunately. I am getting same undefined error for response now also :( even after logging in — tejas, Jan 27 '12 at 11:57
Update: I am using the above code now. I am able to login with the canvas page url, but no friends list is getting retrieved. I am getting undefined value for response.data even after login — tejas, Jan 31 '12 at 05:22
DO specify `channelUrl` when using `FB.init`. DO NOT use an invalid channelUrl. — AndrewF, Dec 17 '12 at 21:30

Accessing Facebook friends list fails when used with JavaScript SDK

1 Answers1