CODEWITHSUNDEEP
facebookfacebook-graph-apifacebook-javascript-sdk
Eric
Eric

Reputation: 2091

Display Facebook Album Cover Image

I'm trying to show the cover photos of a Facebook user's albums, but I am not having any luck.

What I have so far is this:

        FB.api('/me/albums', function(response) {
            for(var i = 0; i < response.data.length; i++)
            {
                if(response.data[i].cover_photo != undefined)
                {
                    var alb = $('<div class="album" id="album-' + response.data[i].cover_photo + '"></div>').appendTo(view_scroll);
                    alb.css('background', 'url(https://graph.facebook.com/' + response.data[i].cover_photo + '/picture)');
                }
            }
        });

All I am getting is a question mark image. Any suggestions on how get the actual cover image into the background of the div?

Upvotes: 1

Views: 2014

Answers (2)

Chris Villegas
Chris Villegas

Reputation: 37

Hi i had the same problem, and i already got the cover_photo from every album of the user. Im using javascript sdk. After checking the login status, just call the function albumes():

function albumes() {

   FB.api('/me/albums?fields=name,link,cover_photo,id',
      function(response) {
         for(var c = 0 ; c < response.data.length ; c++) {
            coverPhoto(response.data[c].cover_photo, response.data[c].name);
         }
      }
   );
}

function coverPhoto(id, nombre){

   FB.api('/'+id+'?fields=picture',
      function(responseIn) {
         $('#javascriptData').append(
              "<br>"+ nombre +"<img src='"+ responseIn['picture'] +"'>");
        }
   );
}

Upvotes: 1

Eric
Eric

Reputation: 2091

Found it... Needed to add the access token to the end of the url:

background-image: url(https://graph.facebook.com/' + response.data[i].cover_photo + '/picture?access_token=' + [ACCESSTOKEN]

Upvotes: 1

Related Questions