Facebook Cookbook

Linking to External FBJS Files

Problem

I have a large block of FBJS that I use throughout my application, and I’d really like to have the browser cache it for better client-side performance.

Solution

Facebook Platform supports linking to external FBJS files through the <script> tag with a src attribute, the same way you would with traditional JavaScript. Simply add a line to your source file and stick the JavaScript file on your server:

<script src="http://www.foo.com/bar.js"></script>

Your external file will get included in your rendered FBML pages, with a cache policy set to never expire.

Discussion

As with most traditional JavaScript you put into your app pages, your <script> tag will be rewritten by the FJBS parser into something you’ll barely recognize. Our example would appear in the final page as:

<script src="http://apps.facebook.com/fbjs_get.php?src=
http%3A%2F%2Fwww.foo.com%2Fbar.js&appid=12345&pv=1&sig=xxxxxxxxxxxx"></script>

You can access that URL directly (not the one here, but the one from your own app), and you’ll see your external JavaScript file after it’s been run through the FBJS parser. If there’s anything wrong with your script or the parser isn’t able to do its thing, you’ll simply get a 0 as the return value (i.e., a blank page with the only content being the character 0). All of your variable, object, and function names will get rewritten by fbjs_get.php the same way your inline JavaScript is.