Facebook App Development

Posted byProsoxi.com Webmaster Leave a comment on Facebook App Development

A facebook web application is really a webpage loaded into an iframe in their interface. You can also develop desktop and mobile apps using some of the available tools and SDKs. For this post I will talk about the facebook web app that I created. I had previously created a flash game so I decided to use this game and add a button that allows the user to publish their score to their wall. I downloaded the Adobe ActionScript 3 SDK for Facebook Platform API. I added this library to my app from Publish Settings.


I then modified my flash app with the following code.

import com.facebook.graph.Facebook;
import com.facebook.graph.data.FacebookSession;
import com.facebook.graph.net.FacebookRequest;

Facebook.init("YOUR_APP_ID", postToWallHandler);

function score_click(event_object:MouseEvent)
{
    Facebook.postData('/me/feed/', postToWallCompleteHandler, {message:"I scored " + txt_score.text + " points playing TECHTT's flash game!"});
}

function postToWallHandler(result:Object, fail:Object):void
{
}

function postToWallCompleteHandler(response:Object, fail:Object):void
{
}

I then had to embed my published swf on an html page as follows. The SDK is very picky and not well documented and I found that I had to embed exactly as follows.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">

<head>
    <script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
</head>

<body>
    <div id="fb-root"></div>
    <div id="flashContent">
        <h1>You need at least Flash Player 9.0 to view this page.</h1>
        <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>
    </div>
    <script type="text/javascript">
        swfobject.embedSWF("game.swf", "flashContent", "320", "480", "9.0", null, null,{"appId": "YOUR_APP_ID","allowscriptaccess": "always"}, {name:"flashContent"});
    </script>
</body>
</html>

After uploading my html and swf file I then proceeded to setup my app on facebook using thier setup page. You can get more info on this process from their documentation. The app and status update looks as follows.

There is a limit to how often and how much you can post to a wall from your app so keep this in mind while testing. Also you will also have to get publish to wall permission for your app. For testing purposes I did it manually by going to the following URL : https://graph.facebook.com/oauth/authorize?client_id=YOUR_APP_ID&scope=publish_stream&redirect_uri=http://www.facebook.com/apps/application.php?id=YOUR_APP_ID

A check for this permission and loading of this URL from your app can be easily automated using the same api or even javascript.

Source

http://techtt.hassantt.com/2011/06/facebook-app-development.html

Leave a comment