Jun
28
2011

 


NOTE: This method appears to be broken at this time (7/28/2011). I don’t know if and what has changed on the Facebook side, it just stopped working. Will update this post if it works again.

UPDATE (8/9/2011): The method has slightly changed but works again now. Please see this post for the update.

Posting to user’s wall is easy enough but what about if you want an application to post, say user accomplishment (such as High Scores or user achievements) onto the application page?

The process is actually straightforward. What is confusing is that an app has to use the page administrator credentials in order to post to its own page. The process of getting the credential requires a one-time ‘extraction’ of an access_token .

So here are the outline of the steps to publish as a Page. This example uses the Javascript Graph API (for an overview of using the API, you can read a tutorial here). There’s also an example Javascript page that pull access_tokens that I will describe later.

  1. Get the access_token of one of the Page administrators.
  2. Call the publish command using FB.api(/me/feed/) or FB.ui(…) to post, while passing the access_token as one of the parameters.

1. Getting the access_token of A Page administrator

Setup the login process (you existing login process should work, or see here for a guide). One thing to change here is the permission: you need to request the manage_pages permission, like below:

FB.login(callback, {perms:’manage_pages’}).

When you load up the page in the browser, you will be prompted for the manage_pages, which is the Manage My Pages permission.

Before that though, we need to add code to retrieve the access_token. Here’s an example, which prints to the Firebug console (comment out the console.log(response); line if you don’t have Firebug).

[c]
function onLoggedIn()
{
    FB.api('/me/accounts', 'get', {}, onAccountsInfoResponse);
}

function onAccountsInfoResponse(response)
{
  // Print to Firebug console
  console.log(response);
  // Display on page.
  for (var i=0; i<response.data.length; i++)
  {
    var item=response.data[i];
    document.write("<br>"+item.name+"("+item.id+")");
    document.write("<br>"+item.access_token);
    document.write("<hr>");
  }
}
[/c]

Now, after you created the page above, go ahead and login as the admin for the page.  You need to be the page administrator in order to have an access_token for the page — if you are not the admin, ask someone who is.

The onAccountsInfoResponse has a list of pages that the logged in user has a right to manage. The response looks like this:

If you don’t have Firebug to print to the console, the above code also prints the result onto the browser window. Copy the access_token of the app page (or the fan page) that you wan to post into (an app does not have to post to its own page, but can post to other pages as long as you have its access_token) .

Note: Firefox 4 produces error when calling document.write in the above manner. See this page instead to see a more general implementation: http://www.permadi.com/tutorial/get-facebook-access-token/index.html
Enter your APP ID and login as an administrator to see the access_tokens. Also examine the source to see how it works.

2. Posting To Page Wall

Just use the /me/feed API to post to the Page feed. You need the have the publish_stream permission. Example code:

[c]
function postToPage()
{
  var postContent =
  {
    access_token: "YOUR access_token", // replace with the access_token that you got from the previous step
    message: userName+" has just scored "+Math.round(Math.random()*100000)+" in Cool Game",
  };
  FB.api('/me/feed', 'post', postContent, onPostingResult);
}

function onPostingResult(response)
{
  if (!response || response.error)
  {
    alert('FAILURE: '+response.error.message);
  }
  else
  {
    alert('SUCCESS!');
  }
}

[/c]

The result in the Fan page wall is like this:

You can also insert picture into the post, like this (do View Source in the example link below to see the parameters that I used):

To allow user to post messages, use FB.ui instead of FB.api — more information can be found here.
See this for more info: http://developers.facebook.com/docs/authentication/#app-login
You can add images and links into the feed. See the parameters reference at: http://developers.facebook.com/docs/reference/api/post/

Links

Cautions

  • An access_token can become invalid if the user who owns the access_token uninstalls the app or changes his/her password.
  • Posting may fail if you post the exact same message twice in a short period of time. I am guessing this is to prevent spamming, so if posting was successful and suddenly fails, try waiting for a while.
  • Do not spam! Do no spam!
  • All the people who have Liked your App will see post in the app page. Users may be annoyed if they see too many posts from your app and they might think your app is spammy. Facebook recently increased its spamming monitor by autobots, so you really needs to make sure that your user won’t find the posting spammy. See horror stories: http://forum.developers.facebook.net/viewtopic.php?id=103438&p=1

4 Responses to “Facebook Graph API: Posting Feed To App Page As Page”

  1. Hello,

    I was using this technique and it was working until three days ago. Now whenever I try to post on my page, the post shows on my own profile. Do you know if Facebook changed stuff, or it has to do with the access token.

    Please let me know,
    Vinny

  2. Hi, thanks for the tutorial but I can not post as page even if I sent the access_token. Could you help me with this ?

  3. Yes, it appears to be broken at this time (confirmed 7/28/2011). I don’t know if and what has changed on the Facebook side, it stopped working. Will update this post if it starts working again.

  4. For those who discovered that the method no longer works. Here’s a possible solution:
    http://www.permadi.com/blog/2011/08/facebook-graph-api-posting-feed-to-app-page-as-page-revisited/

Leave a Reply

*