Photo upload to Facebook from your PHP web application

Recently I was asked by one of my clients to develop a feature on his website so that a user on that website may click on a button and publish an image from his/her account (on that website) to his/her facebook account. While doing so the system would ask for the users facebook credentials.

Sounds simple? Yeaah...apparently its simple but when you start getting your hands dirty you slowly realize you are in deep mess. Particularly if you are a first timer as far as developing on facebook platform is concerned.

There are multiple ways to achieve this. Using facebook connect or using a facebook application specially developed by yourself to accomplish the task. I followed the second approach. I'm trying to outline the exact steps you need to perform to get this up and running with least pain. And yes, the following examples would all be in
PHP.
  • Login to facebook, click on the developers link available in the footer section of the page and follow the steps so that ultimately you end up setting up a new application. You should provide a meaningful name for your application and proceed to the next page where you will be asked for a lot of information. The Basic section would contain your API key and Secret. These two are of prime importance while you would be making your API calls, so keep them handy. Choose Canvas from the left menu (or wherever you find it on the page, the page might get changed from the time when this post was composed). Provide a Canvas Page URL and Canvas Callback URL. The first one is a friendly URL for your application as part of Facebook (http://apps.facebook.com/my_sweet_application) while the second is basically the URL of your application which would eventually run integrated into facebook. An example could be http://www.yourwebsite.com/your_app_directory/index.php. Set the Render Method as IFrame. What basically this means is your application would run in an IFrame inside facebook. So you won't have to depend on FBML and jargons like that and continue with your favourite scripting language. Thats it, nothing more is needed here. Save changes and continue.
  • Great now you need the PHP API wrapper provided by facebook. While writting this BLOG it was available here.
  • Assuming you obtained the PHP API wrapper successfully, the next step is to set up your application. Extract the php directory from the tar.gz and keep it somewhere in the directory from where you plan to run your application.
  • Great, now on your page, i.e. the page which your Canvas Callback URL points, include the facebook.php page from the php directory you created in the last step.The following code shows how you may create the facebook object to make subsequent calls to the actual Facebook API.

    /*Instantiate object and make calls, where $api_key and $secret are your application specific keys as described above*/

    $facebook = new Facebook($api_key, $secret);

    From here on you can make calls to all methods exposed by facebook through $facebook and $facebook->api_client
  • The next step is to get the user authenticated by Facebook. You may do so with the help of the following code:
    $facebook->require_frame();
    $user = $facebook->require_login();
    This should immediately take your user to the facebook login screen where the user would be validated with his/her facebook credentials. Once the facebook authentication is complete your user would be again redirected to your application callback URL. Also facebook would return you a lot of data which would be available as a part of the $_REQUEST collection. You may print_r($_REQUEST) to see what all information is returned. We would be particularly interested with auth_token, fb_sig_user and fb_sig_session_key.
  • It is worth mentioning that in every other pages of your application while you are running Internet Explorer, you have to regenerate the session for facebook API to work fine. This is done with the help of auth_getSession function. This function takes the auth_token we obtained from Facebook in the last step. The following code explains this:
    $fbres = $facebook->api_client->auth_getSession($auth_token);
  • Assuming that the image is already present on the filesystem of your server (you may choose to upload it on the fly also, depends on how you want your application to work actually) and the image path is stored in $file, the code to actually upload the file to the facebook would be:
    $response_array = $facebook->api_client->photos_upload($file, $album_id, $your_message, $fb_sig_user);
    The variables are pretty self explanatory I guess. $fb_sig_user contains the userid returned by facebook as explained earlier. $album_id is the id of the album in which you would like to upload you photo. To find out dynamically what are your albums are, run the following code:
    $album_arr = $facebook->api_client->photos_getAlbums($fb_sig_user);
    This would return all the albums from your facebook account. Please note if there are not a single user created album present, it would still report a single album, namely 'profile album'. I was unable to upload a photo into the profile album so I decided to create one on the fly. I used the following code to do so:
    $create_album_response = $facebook->api_client->photos_createAlbum('Your album name', 'A short text describing your album', '', 'everyone', $fb_sig_user) ;
    For an explanation of the third and fourth parameter, you may search the facebookapi_php5_restlib.php file in the php directory for photos_createAlbum.
  • That's it, you have successfully uploaded your photo to facebook. There are few things I must discuss for the sake of completeness of this post. First, the photos you upload programatically must be approved in the facebook by the user to make them go live. Second, the session created by the program often creates problem in successive calls if not cleared properly. To do so I would recommend, that you log your visitor off forcibly once the photo is uploaded successfully. You may employ the following code to do so:
    $facebook->logout('http://www.yourwebsite.com/your_app_directory/byebye.php');
These are the basic steps to upload a photo to a facebook account from an external application. The steps might vary depending on the actual requirement of your scenario. I would be happy if the above walk through really help someone who is in trouble with similar kind of situation. Please feel free to leave your comments. Thanks.

Comments

Unknown said…
Hello :

is exactly what I am trying to do know.
And yes , just read it have helped me a lot
David
Timothy said…
im gonna try it and see where it takes me, il pop a q whenever i have one, thank you!!
cayden liew said…
wow, this is what i would like to implement! thank you so much!
Anonymous said…
hi, this is what am working on right now, and you've just helped me a lot. i would just like to know the code i will be writing in my html to make this app work and upload a dynamic photo. thanks.
Anonymous said…
this great dude . i am very thankful towards you
Anonymous said…
Thank you so much. I've been wanting to know how to do this for a long time!
Anonymous said…
you saved the day. though the auth_getSession was giving me an 'Invalid parameter' error.
Anonymous said…
thanks i needed this simple overview. Lets hope its stays simple, somehow its seems facebook has seemed to make things more diffivult than it should be
Anonymous said…
$facebook->api_client->photos_getAlbums($fb_sig_user);
is given only one parameter but at runtime it is asking for another param.

Error :
Warning: Missing argument 2 for FacebookRestClient::photos_getAlbums(), called in xxx\index.php on line 14 and defined in xxx\rest-api\facebookapi_php5_restlib.php on line 1684.

I tried with NULL or '' as second parameter but the response is an empty array.

Popular posts from this blog

uTorrent: Data error (cyclic redundancy check)

d(a).zindex is not a function

Khude Jajabor Istasi