Facebook Cookbook

JavaScript Client Library

Problem

I’d like to use the JavaScript Client Library to access the API, but I want to make sure I understand any potential limitations and how to get set up before I jump in.

Solution

The JavaScript Client Library is a new addition to the Facebook family and was still in beta at the time this book went to press. The biggest advantage is that you can use it from an HTML page with no server-side code required, which can be served up by Facebook either inside an iFrame-based app or inside an fb:iframe in a Canvas-based app. This opens up the possibility of creating apps with really rich Ajax interactions, which can even run outside of Facebook (provided that the user is logged into Facebook in another window or tab).

Since there’s no server-side code, there’s nothing for you to download. The first step is to create what’s known as a “channel page” on your server, which uses a library developed by Facebook to enable communications between your site and Facebook without running into cross-domain scripting limitations. Create a page on your site called xd_receiver.html and enter the following HTML into it (you can copy and paste from http://wiki.developers.facebook.com/index.php/Cross_Domain_Communication_Channel):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Cross-Domain Receiver Page</title> </head> <body> <script src="http://static.ak.facebook.com/js/api_lib/ ...