Getting to grips with the Facebook API with PHP and JavaScript SDK Part 1

31 Jan 2014 . category: code . Comments

For a research project we are working with peoples Facebook data amongst other social data, this required writing an application to inspect user content utilising the public API. This process shone some light on the privacy of Facebook. A lot of stories in recent years have focused primarily on how Facebook changes its privacy settings but not enough has been focused on the vulnerability of apps to the privacy intentions of the user.

To give you an understanding I though I would work through an example of how you can easily create an app and access more than probably expected about your data and your friends. To note before anyone complains I realise that you are required to install the application for it to have any meaning, but I will give an example of where what happens is not possibly what you would expect to counter this.

During testing of our app for the project a collection of colleagues installed a test version to make sure when used in the wild it would perform as expected. A user had their privacy settings so that friends of the user could not see the their friends unless they were in common. This I am sure is common for a lot of people on Facebook, what happened with the app though is it got full access to her friends list, now may sound strange to highlight this since it asked for permission to do this, but when you consider that this user is sharing more with a random installed app than with their actual friends? I am doubtful this is was what was originally intended by this user.

Anyway, back to the example. This is worked through using Facebook Developer interface with Facebook PHP SDK.

The Facebook API is incredible simple but also incredible confusing at the same time -- what you would expect from a major corporation’s software. 

So I will break this down into several steps that I will cover over a series of articles in general I will try to address 2 aspects per article:

  1. Authenticating a user / Getting them to install your app
  2. What the app can see of my feed
  3. What the app can see of my friends
  4. Photos galore
  5. Having some fun with the API
  6. The monkey in the closet

A couple of notes on what this will tell you how to do and what it wont. I am writing this app as an external entity to Facebook and less intended to be nested into the Facebook site via their canvas approach. To achieve a nested app you will probably want to do things a little different and probably exploit javascript.

1. Authenticating a user / Getting them to install your app

Facebook apps are simple to write once you get a handle on the paths required is simple to adjust to do more. So to get someone to install your app you need a link[Ref: Facebook PHP SDK examples].

To get started, you need to direct the perspective user to Facebook

Firstly create an object with your app credentials and see if you have a user, this follows SDK example

require 'api/utils/facebook.php';
$facebook = new Facebook(array(
  'appId'  => 'xxxx',
  'secret' => 'xxxx',
));
$user = $facebook->getUser();
if ($user) {
  try {
    // Proceed knowing you have a logged in user who's authenticated.
    $user_profile = $facebook->api('/me');
  } catch (FacebookApiException $e) {
    error_log($e);
    $user = null;
  }
}

Now you can either do something with the $user or detect NULL and push them to add your app

if ($user) {
  $_GET["id"] = $user_profile['id'];
  $logoutUrl = $facebook->getLogoutUrl();
} else {
  $statusUrl = $facebook->getLoginStatusUrl();
  $pageURL = 'http';
  if ($_SERVER["HTTPS"] == "on") {$pageURL .= "s";}
  $pageURL .= "://";
  if ($_SERVER["SERVER_PORT"] != "80") {
    $pageURL .= $_SERVER["SERVER_NAME"].":".$_SERVER["SERVER_PORT"].$_SERVER["REQUEST_URI"];
  } else {
    $pageURL .= $_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"];
  }

  $params = array(
     scope => 'read_stream,user_photos',
     redirect_uri => $pageURL."?type=0"
  );
  $loginUrl = $facebook->getLoginUrl($params);
}

So to highlight a couple of differences between the PHP SDK example and the above code. This code requests permissions and secondly specifies redirect url. These are both useful since you need to request your permissions here as well as in the app settings. Here you can see we have requested read_stream and user_photos there is a list of available of facebook basic and extended permissions available at https://developers.facebook.com/docs/reference/login/extended-permissions/. Also to note by providing the return url you can specify any properties you want so in my example I had multiple modes of using the app requesting different permissions defined by type.

Ok so now we have done all this we can now push a user to the App using the $loginUrl. As I mentioned earlier my scenario is external to Facebook you would probably want to automatically request permissions if you are in the canvas.

<a class="btn" href="<?php echo $loginUrl; ?>">Install my app it’s awesome!</a>


2. What the app can see of my feed

To continue my previous rant I’ll give you some examples of what you can do with Facebook exposing more than you possible more than you expected.

Completely public details:

https://graph.facebook.com/706861067

or

https://graph.facebook.com/StuartAaronJames

Returns:

{
   "id": "706861067",
   "name": "Stuart James",
   "first_name": "Stuart",
   "last_name": "James",
   "link": "http://www.facebook.com/StuartAaronJames",
   "gender": "male",
   "locale": "en_GB",
   "username": "StuartAaronJames"
}

To get a bit further you need a token, easily acquired via making an app or the development site on Facebook. So now to get a grip with the api to get a user feed simple extend the url with /feed and your token. If you don’t have that user yet you can view their public feed.

https://graph.facebook.com/706861067/feed?access_token=XXXX

Facebook is great for JavaScript developers returning information in JSON format. So you can utilise

var jsonObject=JSON..parse(response);

Then iterate over the response contains two components an array of data items in the “data” tag and paging information to get the next and previous via the “paging” tag.

To get started with this and see what your profile will return follow these simple steps

  1. Sign up as Facebook Developer (Sadly my memory of this process is vague having done it several years ago, it is barely more than clicking yes on developers.facebook.com)
  2. Navigate to https://developers.facebook.com/tools/explorer/ and grab your key
  3. Navigate to https://graph.facebook.com/me/feed?access_token=XXXX
  4. Replace XXXX with your token

You will see the JSON response and you can figure out how to parse your profile feed into something more meaningful.

To Come…

The next article will cover:

  1. What the app can see of my friends
  2. Photos galore

And will hopefully include more pictures!


Stuart James  


Stuart James

Assistant Professor in Visual Computing at Durham University. Stuart's research focus is on Visual Reasoning to understand the layout of visual content from Iconography (e.g. Sketches) to 3D Scene understanding and their implications on methods of interaction. He is currently a co-I on the RePAIR EU FET, DCitizens EU Twinning, and BoSS EU Lighthouse. He was a co-I on the MEMEX RIA EU H2020 project coordinated at IIT for increasing social inclusion with Cultural Heritage. Stuart has previously held a Researcher & PostDoc positions at IIT as well as PostDocs at University College London (UCL), and the University of Surrey. Also, at the University of Surrey, Stuart was awarded his PhD on visual information retrieval for sketches. Stuart holds an External Scientist at IIT, Honorary roles UCL and UCL Digital Humanities, and an international collaborator of ITI/LARSyS. He also regularly organises Vision for Art (VISART) workshop and Humanities-orientated tutorials and was Program Chair at British Machine Conference (BMVC) 2021.