Created

Requirements

Prerequisite knowledge

Experience with JavaScript, ActionScript, and Flash Builder, as well as some familiarity with Facebook will help you make the most of this article.

User level

Intermediate

When you develop and deploy an app or game on Facebook you need to invoke the Facebook API to login as well as to get details about the user, friends, photos, and other information. There are currently several official SDKs that you can use to perform such tasks via the Facebook Graph API. This article will guide you through the basics of using the JavaScript SDK with ActionScript 3.

The Facebook API is simple and supports rapid extensibility without API changes, via the Graph API.

A good place to begin is with these three Facebook JavaScript API calls:

FB.init – initialize Facebook API

FB.login - login to Facebook

FB.api - perform a Graph API call on Facebook

You can call the JavaScript wrappers from ActionScript using flash.external.ExternalInterface. This provides access to the Facebook API from the Flash runtime and enables you to be always up-to-date whenever Facebook changes or updates their official JavaScript APIs (see Figure 1).

To try this out yourself, you need to complete following steps, which are outlined below:

Set up communication between Flash and JavaScript

Set up a development server for the Flash app

Create a new Facebook app

Initialize the Facebook JavaScript SDK

Login to Facebook and get some data

Step 1: Set up communication between Flash and JavaScript

To call the Facebook JavaScript SDK from the Flash runtime, you first need to establish communication between the two layers using ExternalInterface.

Add these three functions into your main ActionScript 3 class and call the init() function from the constructor:

Step 4: Initialize the Facebook JS SDK

To initialize the SDK, include the following code within your HTML <head> element and replace YOUR_APP_ID with the App ID you noted in the previous step. (If you are using Flash Builder, add this code to index.template.html.)

Now you have set up basic communication from Flash Player to JavaScript to Facebook and back.

The code above calls the FB.login function and creates an anonymous function callback, which checks for the actual authResponse status. It then calls FB.api function, which calls the Facebook Graph API. To get information about the current user, it simply passes '/me' as a parameter.

Once you have logged in, you can just call FB.api("command") alone without the need for FB.login; for example: