Question

I’m trying to post a Facebook profile picture into a Jquery popup window and do not know what I need to do after getting a FB access token (see “Client-side flow” at https://developers.facebook.com/docs/authentication/).

I’m able to successfully get a FB user object’s ID using the FB Javascript SDK via the FB.api (after getting an access token):

 FB.api('/me', function(response) {
   alert(response.id);
 });

The FB.api returns the user’s id in a popup box; however, I need to use the user’s id to access his/her picture with the following URL:

 http://graph.facebook.com/(INSERT USER'S ID)/picture

Can somebody tell me how to get the ID from the FB.api so I can create the appropriate URL to pull up the image in a Jquery popup window? Please keep in mind that I’m very new to Facebook’s API and Jquery.

Thanks in advance for your help!

Answer 1

If the current facebook user is authenticated, the response of the javascript call ” FB.api(‘/me’, function(response) ” is the user object and you can retrieve the facebook ID of the user using response.id. The profile image url of the user would be the same as you have mentioned in your question.

To insert this image in a popup, you can use the following code (I am assuming that you already have created a image tag to show this profile image in)

   FB.api('/me', function(response) {
      $("#"+youImageTagId).attr('src', "http://graph.facebook.com/"+response.id+"/picture")       
   });