.NET Answers

Yeah, I know.  It has been a LONG  time since I posted anything.  I’ve been busy.

One of my recent projects brought up something I think you may be interested in so I thought I’d post about it.

Recently, I created a Facebook tab for Labels For Education using DotNetNuke 6.1, which just added an API for retrieving information from Facebook.

Unfortunately, documentation for creating Facebook applications in ASP.NET is difficult to find, primarily because Facebook keeps changing how things work.  No doubt, this article will be old within the next year.  But I hope to give you what you need as of today.

First, the requirements for the application.

The app needed to be able to display a gateway page that disappears once the user “Likes” the page.  After that, the real application displays.  Allow the user to find their school, select it, and then assign points to that school.  If the user has already selected the school, display a “thanks for playing” page.

Sounds pretty simple.  The new APIs have a way of detecting both that the page has been liked and the Facebook ID of the user (this is a number, not their username).

var device = ClientCapabilityProvider.CurrentClientCapability;
if(device.FacebookRequest.PageLiked)
   faceBookId = device.FacebookRequest.UserID;

Looks pretty simple, right?

What isn’t obvious, or at least it wasn’t to me, is that you can’t retrieve the UserID property if you haven’t authenticated the app with Facebook.  UserID will have your ID in is as a developer because as a developer, you gave yourself permission when you created the application.  But if someone else goes to use the app, that property will be empty.

So here’s the bit of code you need to get the authentication working.

First thing you’ll need to do is go to codeplex and download the Facebook API DLLs.

http://facebooksdk.codeplex.com/documentation

You should install these DLLs via NuGet so that  it will  modify your web.config file with the necessary entries.  Otherwise you’ll need to put these entries in manually.  Once  you’ve installed to one project, you can search the web.config file for “facebook” to see what changes are required.

Then you’ll need to add this code:

var oauth = new FacebookOAuthClient(FacebookWebContext.Current.Settings)
{
    AppId = Settings["AppId"].ToString(),
    AppSecret = Settings["AppKey"].ToString()
};
var parameters = new Dictionary<string, object> {
  { "redirect_uri", Settings["FacebookTabUrl"]}
};
var loginUrl = oauth.GetLoginUrl(parameters);
Page.ClientScript.RegisterClientScriptBlock("".GetType(), "redirect",
    "top.location.href = '" + loginUrl.AbsoluteUri +"';", true);

Since this is a dotnetnuke module, I’m grabbing the AppId and AppSecret from settings I’ve specified for the module.

Next, I’m specifying where the Facebook authentication page should redirect once the tab has been authenticated.

GetLoginUrl() returns a string that represents the URL of the authentication page on Facebook based on the parameters you passed.

If you need an example of how to request extended parameters (more permissions),  then you can take a look at this post: http://blog.prabir.me/post/Facebook-CSharp-SDK-Writing-your-first-Facebook-Application.aspx

Since our application lives in a frame, we are using javascript to redirect to the authentication page.

Once the user has authenticated your app with Facebook, their UserId will be available.

Oh.  And you can find the app here:

http://www.facebook.com/labelsforeducation?sk=app_322858714413212

4 Responses to “Facebook App using DotNetNuke”