Facebook Page Tabs and Access Tokens

This is a tricky little issue that has tripped me up a few times and for which I’ve finally found an answer.

If you design a Facebook application, and a Facebook user grants permission to your application to access your data, you can do all sorts of nice things with their friend lists, events, interests, birthday etc.

Your application is allowed obtain that user data on the basis of an access token, which is obtained as follows:

  • You direct the Facebook user to a Facebook URL that describes what data you want access to
  • The Facebook user clicks a link on that Facebook URL to indicate their approval
  • The Facebook user is then redirected back to you application, using a URL that contains a “code” parameter in the GET Request
  • Your application collects that code, sends it back to Facebook, and Facebook responds with a string which is the access token for that user

In this way, Facebook knows that the user in question has allowed your application to access particular data about them.

Now, here’s where it gets a bit more complex.

Facebook allows you to host applications in one of two ways: on a Canvas, or in a Page Tab. Regardless of which you choose, Facebook provides you with a dedicated link for your application as it is presented in either a Canvas or a Page Tab. It is to this URL that the user is generally redirected when Facebook needs to send your application the “code” parameter that your application needs to  request an access token.

However, in the case of both the Canvas and the Page Tab, your application is presented in an IFRAME within the general Facebook skin.

Here, an important difference occurs.

In the case of an application hosted on a Canvas, Facebook will pass on the “code” parameter to the source URL for your application, which is what Facebook uses as the src for the IFRAME. Your application can then pick this up and request the access token.

In the case of an application hosted on a Page Tab, Facebook will not pass on the “code” parameter to the source URL for your application, which means your application cannot request an access token, which means it can’t make requests for user data.

To have your Page Tab hosted application interact with the Facebook API, you need to obtain your access token in a different way.

When Facebook loads your application in the IFRAME, it sends you application a Signed Request, or in other words and encrypted string contain data about the user who is viewing your Page Tab. This tells you thinks like their Facebook ID, if they are an admin of the Page hosting the Page Tab and if they have Liked the Page.

This also contains value named “oauth_token”. Is it this value that you use as your access token when making requests for data for the user who is viewing your application.

Note: to use this, the user still has to have authorised your application to access your data, so you still need to use the Facebook application authorisation process.

You can read more about authentication and Page Tabs at this link, which also links you to a page that tells you how to decode the Signed Request:


Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>