MVC + Facebook == Wonderful Development Platform
Just recently I started experimenting with the ASP.NET MVC Framework and the Facebook Development Platform, it has been a very bumpy road, but I have ironed out some major issues that I would like to share with you today. I will start with a little history of what I am trying to do. For about a month and a half I have had one of my IdeaPipe interns, Dimitry, experimenting with creating a FBML (Facebook Meta Language) Application with MVC. MVC is an ideal platform for FBML because with MVC you have total control over your markup which is needed to have a lean FBML application. I am not going to go in to the differences of developing an FBML vs IFrame Facebook Application, because that information is easily found with a Google Search. What I am going to talk about is the hurdles I overcame and the custom software I had to develop to get MVC working smoothly with Facebook.
In my last post on the subject I was using the Facebook Developer Toolkit, however because of various implementation problems that were at the foundation of the software when working with MVC, I moved to Facebook.NET which is a object based model for implementing the Facebook Session instead of an inheritance model. What you will need in order to get started is:
- Facebook Developers
- Facebook Developers Wiki
- Facebook.NET Source Code (the source code is important because we need to modify one external interface from internal to public)
One of the problems I ran into was creating a Facebook Session from my Action Method. To remedy this issue I created a FacebookAttribute that is an ActionFilterAttribute and a FacebookWebSession based off of the work done on Facebook.NET.
FacebookAttribute
The FacebookAttribute is added to your Action Methods and will look like the following:
[Facebook(ApplicationName = "IdeaPipe")]
public ActionResult SomeAction(FacebookService facebookService, FacebookSession facebookSession, int myOtherVariables)
{ ... }
As you can see the FacebookAttribute just attaches to the Action Method and you just have to specify your ApplicationName that you want to instantiate. The FacebookAttribute also passes in a FacebookService and FacebookSession object for use in your method. The other keys get set in your Web.Config as any standard Facebook.NET application would.
<facebook>
<application name="IdeaPipe" apiKey="1234" secret="5678" type="GlobalApplication" />
</facebook>
The magic behind this attribute is pretty simple.
public override void OnActionExecuting(ActionExecutingContext filterContext)
{
FacebookApplicationSettings settings = FacebookSection.GetApplication(ApplicationName);
ApplicationKey = ApplicationKey ?? settings.ApiKey;
Secret = Secret ?? settings.Secret;
FacebookWebSession session = new FacebookWebSession(ApplicationKey, Secret);
session.Initialize(HttpContext.Current);
FacebookService service = new FacebookService(session);
if (filterContext.ActionParameters.ContainsKey(ActionParameterFacebookSession))
filterContext.ActionParameters[ActionParameterFacebookSession] = session;
if (filterContext.ActionParameters.ContainsKey(ActionParameterFacebookService))
filterContext.ActionParameters[ActionParameterFacebookService] = service;
}
Download: FacebookAttribute.cs
FacebookWebSession
The FacebookWebSession was developed out of necessity because the only other FacebookSession objects in Facebook.NET are strongly tied to a WebForms Control that couldn’t be created as easily as I did in the FacebookAttribute. I am going to fore go the source code since much of this is a copy, paste, and rearrange from the Facebook.NET source. Plus much of it is just boring if-then-else statements that go on for awhile and just do a technical setup from the query string fields.
Download: FacebookWebSession.cs
FacebookSection
This is the file that I had to change the one method from internal to public so that I could get the information contained in the Web.Config configuration for my application. Note this file will not be necessary in the future if my changes get accepted in to the Facebook.NET source tree.
This file replaces the \Web\Configuration\FacebookSection.cs of the Facebook.NET source.
Download: FacebookSection.cs
Download: Facebook.NET Binaries For MVC
So that is all that you should need in order to start working with Facebook Applications in MVC. Note that it is still a good idea to include the FacebookApplication control on your pages because it is still needed. The primary goal of the source code above was to allow the use the the FacebookSession in the Action methods. If you have any questions please post them below.








June 6th, 2008 at 7:08 am
MVC Facebook == Wonderful Development Platform…
You’ve been kicked (a good thing) – Trackback from DotNetKicks.com…
June 7th, 2008 at 2:03 pm
[...] MVC + Facebook == Wonderful Development Platform (Nick Berardi) [...]
June 9th, 2008 at 12:27 am
[...] MVC + Facebook == Wonderful Development Platform – Nick Berardi has been experimenting with the ASP.NET MVC with a view to creating FaceBook applications with it [...]
June 9th, 2008 at 9:02 am
Interesting. Would love to see further examples of the framework.
July 3rd, 2008 at 7:30 am
[...] [Del.icio.us] MVC + Facebook == Wonderful Development Platform – Nick Berardi’s Coder Journal (7/3/2…Thursday, July 03, 2008 from hologramx [...]
August 12th, 2008 at 7:12 pm
[...] Nick Berardi started trying to do the same thing with the FBDT but realized that they had an inheritance model for getting ASPX pages to work correctly which doesn’t work well with microsoft’s MVC model . He moved to the Facebook.NET framework because it was more object based. I feel like I’ve created a better domain model for the FBDT! [...]
November 12th, 2008 at 6:18 pm
Thanks for this. It’s exactly what I was looking for.
I got one little problem, maybe you know an answer. If I use iframe everything works fine, but when I switch to FBML, then there’s a 401 (unauthorized) error. Did you ever come across the same problem? Or have you any idea how I can solve this?
November 13th, 2008 at 10:37 am
Dave, it sounds like you have windows or basic authentication turned on. The facebook servers will not know how to authenticate with your server if this is the case. Or if you have some pages that require you to be logged in, facebook will also not know how to authenticate for this. So you need to have one process for your actual site that uses a cookie and then another that uses the facebook user identifier to log the user in.
June 28th, 2009 at 7:31 am
Facebook.NET hasn’t been updated since the beginning of 2008, do you still recommend using this approach?
June 29th, 2009 at 4:57 am
There is probably a better way now, but to be honest I haven’t looked at the issue in over a year.
July 8th, 2009 at 11:26 pm
Hi!
I’m trying out your tip for a couple of days already. It works fine, thanks!
But I have one problem, whenever I try to click a link within my app ( a link that calls another page on my app ), I always get redirected to my default page – worst thing about it I get the facebook elements within my app ( e.g. My app is within my app together with the FB elements )..
One thing I did not implement on your tip is this:
1. [Facebook(ApplicationName = "MyPage")]
2. public ActionResult SomeAction(FacebookService facebookService, FacebookSession facebookSession, int myOtherVariables)
3. { … }
I am not sure about how to MapRoute it on my Global.asax so I just did this
[Facebook(ApplicationName = "MyPage")]
public ActionResult ShowPage(int pageID)
I am new to MVC and facebook so I badly need your wisdom on this
Thanks!