Muhammad Usman

Crazy tech lover, endless learner
Home

Creating a simple Facebook Application

Facebook Applications are getting much popular these days, its good, but the bad is Facebook frequently changes its API, which causes the resource and tutorials on this subject to be obsolete. That’s why I decided to write an up to date post on how to create an IFrame based Facebook Application using PHP. I am using PHP SDK (3.1) and Graph API, you have to download PHP SDK from here. Well, I am covering the coding part here and not going through how to create and setup a Facebook Application, if you don’t know how then this article might be a good read.

I will create an app which will show all friends’ name. So we will learn, how to :

  • Include PHP SDK
  • Authenticate the user
  • Set scope or permission
  • Get friend list
  • Print friends’ names

I am using an index.php file and a folder named fb_sdk which will contain facebook.php and base_facebook.php obtained from Facebook PHP SDK (path_to_php_sdk/src/). Now we will start writing code in index.php

First we will include the PHP SDK file like below:

   
require 'fb_sdk/facebook.php';  

Now we will instantiate the PHP SDK, here we will provide the Application Id (appId) and Application Secret (secret) obtained from our App settings in Facebook.

   
$facebook = new Facebook(array(  
    'appId' => 'your_app_id',  
    'secret' => 'your_app_secret',  
));  

Now we will get user info from Facebook to check if the user is authenticated or not

   
$user = $facebook->getUser();

// We may or may not have this data based on whether the user is logged in.  
//  
// If we have a $user id here, it means we know the user is logged into  
// Facebook, but we don't know if the access token is valid. An access  
// token is invalid if the user logged out of Facebook.

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 if the user is not authenticated or user has not allowed our app to access certain info then we will redirect user to a URL called loginUrl to allow our app to access his info. As we need user’s friend list only we are asking for read_friendlists permission only. You can ask for additional permissions if you need, a list permissions can be found here: https://developers.facebook.com/docs/reference/api/permissions/.

   
// Login or logout url will be needed depending on current user state.  
if ($user) {  
    $logoutUrl = $facebook->getLogoutUrl();

} else {  
    $loginUrl = $facebook->getLoginUrl(array(  
        'scope' => 'read_friendlists', //you can add more permissions here separated by commas  
        'redirect_uri'=>'https://apps.facebook.com/usman_test_app/' //give your app's canvas URL here, its just example  
    ));  
    //redirect user to loginUrl  
    echo "<script type='text/javascript'>top.location.href = '$loginUrl';</script>";  
    exit;  
}  

Now we have permission to access user’s friend list. So we have to get the friend list using the api() function. The returned value will be an array, then we will loop through the array and print the friend’s name.

 

?>  
<!doctype html>  
<html xmlns:fb="http://www.facebook.com/2008/fbml">  
<head>  
    <title>Facebook App Example</title>  
</head>  
<body>  
    <?php if ($user){  
        //lets get the friend list  
        $friends = $facebook->api('/me/friends');  
        //check if we have a valid list  
        if(!is_array($friends))  
        exit("Unable to get friend list.");
        
        //now we will print friend name from array  
        foreach($friends['data'] as $friend)  
        {  
            echo $friend['name'].'<br/>';  
        }  
        ?>
    
    <?php } ?>

</body>  
</html>

Well we are done now. You have to put index.php and the fb_sdk folder in the root of your app folder. You can access the app by visiting your Canvas URL If you like the post please share it and comment below. Also you can comment if you have any problem or relevant question.