Display Photos From Facebook With Javascript Api?

I want to display photos from one of my facebook albums on my webpage with the javascript api. I can read the album names with the below code, but how can I then display the photos

Solution 1:

This can be done by issuing Graph API request to photos connection of album:

FB.api('/me/albums?fields=id,name', function(response) {
  for (var i=0; i<response.data.length; i++) {
    var album = response.data[i];
    if (album.name == 'Profile Pictures'){

      FB.api('/'+album.id+'/photos', function(photos){
        if (photos && photos.data && photos.data.length){
          for (var j=0; j<photos.data.length; j++){
            var photo = photos.data[j];
            // photo.picture contain the link to picturevar image = document.createElement('img');
            image.src = photo.picture;
            document.body.appendChild(image);
          }
        }
      });

      break;
    }
  }
});

Solution 2:

You use the graph to do it... all you need is the album.id from above, and then you make a call to the graph to get the photos. I passed fields=pictures to tell facebook to only return the picture links. You can omit this parameter and it will bring you a whole bunch of stuff back.

https://graph.facebook.com/<album.id>/photos?fields=picture

The list of all of the fields can be found here Album - Graph API