How to use FB.api('/me/picture') to get profile image

Question

This is a very silly question. I'm a beginner with facebook Javascript SDK. So I'm trying to make a the user's profile image to show I used this code

FB.api('/me', function(response) {      
    document.getElementById('login').style.display = "block";
    document.getElementById('login').innerHTML = '<img src="http://graph.facebook.com/' + response.id + '/picture" />';
});

which worked fine, but I'm trying to understand how to use FB.api('/me/picture') to show the image.

Answer 1

/me/picture (or /{user id}/picture) returns an HTTP 301 redirect to the image location so you can embed it directly into an <img src...

If you want to retrieve the URL and use it yourself you need to specifically request it as a field, via :

 /{user id}?fields=picture

or

 /me/?fields=picture

You can include other fields too, but I'm assuming you just want the photo right now.