Accessing user's Facebook Photos and Albums with Drupal

Sat 14th Jan 2012 -- Lee Rowlands

One of the options for SendMyPostcards.com is for users to choose from their Facebook Photos and Albums for the front of their postcard.

In this article I'll demonstrate how to use the Facebook Graph API from Drupal to access user's details from Facebook including, but not limited to, their albums and photos.

Getting Started

To get started you need the fbconnect module. The module has a fairly involved install process that includes:

  • Standard module installation
  • Registration of your site with the Facebook Developer program and obtaining the appropriate API keys etc
  • Downloading the Facebook PHP SDK
  • For Drupal 6, making changes to your page.tpl.php to ensure that fbxml works

Detailed instructions can be found in the module's read me files, once the whole thing is setup you should have a Facebook Connect button on the registration and login forms.

Requesting permissions

Fbconnect requests a basic set of permissions when the user registers on your site via Facebook, such as their basic details and the ability to send email to them via facebook. However anything beyond that requires elevated permissions. Eg to see their friends or photos/albums.

Luckily fbconnect's api exposes a hook allowing you to add to the requested permissions - hook_fbconnect_login_button_alter. This hook takes one argument $attrs. Using this hook we can request additional permissions. Eg for example to request access to the user's photos:

<?php
/**
* Implements hook_fbconnect_login_button
*/
function mymodule_fbconnect_login_button_alter(&$attrs) {
 
$attrs['perms'] .= ',user_photos';
}
?>

Using the Facebook Graph API

Making sure we're ready to make requests

Once we've got the correct permissions, we can access the user's photos while they have an active session on our site and are logged in to Facebook.
First we check if they're logged into Facebook and grab a reference to the :

<?php
if (!user_is_anonymous() && fbconnect_get_fbuid() && _get_user_fbuid($user->uid)) {
 
// .. processing in here
}
?>

If they're not logged in we can show a login button, eg in a form builder
<?php
  $form
['fbconnect_button'] = array(
   
'#type' => 'item',
   
'#description' => t('Sign in using Facebook'),
   
// We use fbconnect_render_button to render the button with our required attributes (note the user_photos permission).
   
'#value' => fbconnect_render_button(array('perms' => 'email,user_photos')),
   
'#weight' => 1,
   
'#id' => 'fbconnect_button',
  );
  if (!
user_is_anonymous()) {
   
// The user is logged into our site but not facebook
   
$form['fbconnect_button']['#description'] = t('Sign in to your Facebook account');
  }
 
$form['#submit'][] = 'fbconnect_redirect_submit';
?>

Now this form will end up at the default location that fbconnect_redirect_submit sends them too when the user signs in, if you need it to go back somewhere else, you'll need to implement hook_form_alter for $form_id fbconnect_autoconnect_form and add your own submit callback that sets $form_state['redirect'] - just your everyday run off the mill form_alter to modify the redirect location.

Making the request

Once your user is logged into facebook and your site, you're right to start making requests to the Facebook graph api. Eg fetching their albums and images

<?php
// First we get a reference to the facebook client, provided by the Facebook PHP SDK and neatly wrapped by fbconnect
$fb = facebook_client();
// Get their albums
$albums = $fb->api('/me/albums');
// Loop their albums
foreach ($albums['data'] as $album) {
   
$album = (object)$album;
   
//fetch the images
   
$album->images = array();
   
$images = $fb->api('/'. $album->id .'/photos?limit=25');
    foreach (
$images['data'] as $image) {
     
$image = (object)$image;
     
// Do something with the image ....
   
}
   
// Do something with the album ....
 
}
?>

In terms of the 'something' - for SendMyPostcards.com we temporarily cache the user's albums and images. For performance reasons we only fetch the first 25 images from their first album. We request each subsequent album and page as needed and update the cached object. We don't use any permanent storage of the albums or photos as obviously the user will add to their albums and photos over time and we want to fetch the latest values next time they use the site (or after the cache is cleared).

Taking things further

The graph api is very powerful, for the full reference on what you can access using this technique see the developer documentation.
How have you used the Graph API? Let us know via the comments.

Category: