Skip navigation

In recent ASP.NET MVC update, we introduce ASP.NET MVC Facebook Template. In following article, I’m going to discuss one of the features come with the template.

What is Realtime Update?

Realtime update is a Facebook service provide you the capability to subscribe to the changes in the data. For example, you can listen to the changes of user’s Facebook likes. That expands your app’s capability.

How does Realtime Update work?

In short, Facebook requires your service to expose two endpoints. One accepts GET request, which is used to validate your service’s existence. And the other accepts POST request, which is receiving actually data regarding to changes.
The best way to learn Facebook Realtime Update is to read Facebook’s document: https://developers.facebook.com/docs/reference/api/realtime/

What’s in the box?

In template we already have a Realtime Update controller in place to help customer set up their Realtime Update endpoint easily. The controller UserRealtimeUpdateController derives from abstract controller FacebookRealtimeUpdateController. The latter is an abstract WebAPI controller ready to accept GET and POST request.

The GET request is taken care of. What you need to do is to set “Verify Token” to corresponding app setting web.config.

In terms of the POST request, you need to finish the HandleUpdateAsync method. The method is called whenever an update POST is sent from Facebook service.

A step by step guide

Following guides assume you already have a running Facebook App hosted publicly. Please note that you need to have your Realtime Update Endpoints exposed to public so that Facebook Realtime Service and reach to it.

Subscribe to changes

There are two ways to subscribe to a class of objects: you can do manually from App Settings or you can do programmatically by codes. Here let’s pick the easy one. Go to the Realtime Updates setting page under Facebook Apps Setting.

pic1
Add a subscription. You need to choose what object you want to observe (among the five options Facebook currently offer.) and the fields to listen to. You need to give a call back URL pointing to your Realtime Update endpoint. The endpoint accept both GET and POST request. Then the last but not least, you shall choose a “Verify Token”, which serves as the common secret for your App to identify the incoming request’s source.

pic2

Validate your endpoint

Now if you click “Test”, you’ll observe an error:

pic3

Why? Because Facebook send a GET request to your endpoint with a challenge value. It expects your endpoint to return the exact same value to prove its identity. (Here’s what the GET looks like http://fbrealtime.azurewebsites.net/api/realtime?hub.mode=subscribe&hub.challenge=742982751&hub.verify_token=sample_token)

So you need to implement your Realtime Update Endpoint now. If you create your project from Facebook template you will see following controller:

public class UserRealtimeUpdateController : FacebookRealtimeUpdateController
{
private readonly static string UserVerifyToken = ConfigurationManager.AppSettings["Facebook:VerifyToken:User"];

public override string VerifyToken
    {
        get
        {
return UserVerifyToken;
        }
    }

public override Task HandleUpdateAsync(ChangeNotification notification)
    {
        if (notification.Object == "user")
        {
foreach (var entry in notification.Entry)
            {
                // Your logic to handle the update here
            }
        }

throw new NotImplementedException();
    }
}

It is not completed. A few things to do.

    1. Remove the exception throwing, clean up the HandleUpdateAsync. Anything is better than exception.
    2. Go to your web.config. Set Verify Token to “Facebook:VerifyToken:User”.

Publish your site again. By the way, based on your WebAPI route, you probably want to double check your callback URL setting. Now go back to your Facebook App Settings and save the Realtime Update Subscription.

You done for the set up.

To expand your Realtime Update Controller you really just need exam the ChangeNotification objects, structure of which is mimic the JSON value from Facebook.

Potential difficulties

Realtime Update is hard to debug, mainly because it is passively invoked by Facebook not your codes. And if your dev box is not public to internet (for example behind a Firewall like most of the cooperation) you not able to debug your codes directly. As a result you have to rely on trace and logs to find out what’s happened.

Here’s some potential difficulties you need to deal with.

  1. The entire message loops includes a Facebook callback. It is very critical to make sure your service is reachable to Facebook. It is recommended to host your service in a public host and enable web API tracing for debugging.
  2. Don’t forget to set verify token.
  3. Your app shall have the permission to read the fields you subscribe to first. Otherwise, even service pass the GET challenge, it will never receive any POST update.
  4. Realtime Update is not very “Realtime”. Facebook queue the changes and send update a few minutes after changes are made. So be patient.
About these ads

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: