Eternalistic Designs

Freelance Switch

Facebook Authentication in Drupal

The facebook_auth Module

Yesterday, that1guy asked if we had played around with Facebook authentication in Drupal in a thread over on Drupal.org. We hadn't yet at the time, but not being the kinds of nerds to back down from a challenge, we started to look into it.

Thankfully, we didn't have to do much. Halkeye's already submitted a dev version of a Facebook authentication module for Drupal called, strangely enough, facebook_auth.

If you've used Drupal for more than a few days, you've probably noticed that installing new modules is generally pretty simple. You download the module, decompress it in your modules directory, activate it in your site's admin page, and fiddle with any settings as appropriate. If you have any questions, there's typically a good README file in the package that breaks them down for you. Piece of cake.

Unfortunately, facebook_auth installation wasn't quite that easy. Had to jump through a few extra hoops to get it to play nice. Chalk it up to the fact that it's still in the early dev phases of the dance competition, but the README file included in the package left a bit to be desired... Still, though, after playing around with it for a little while, we got it working on our development site.

Installation

First thing's first... Uses Drupal 5.2 with PHP 5.1.6 and MySQL 5.0.27. Halkeye says he's "fairly certain head will work for both 5 and 4.7," but we only tested with 5.2. Seems to work.

Ok, so first thing you need is the facebook_auth module, available over at http://drupal.org/project/facebook_auth. Download that and decompress it in your /modules directory just like you normally would. That should create a directory within /modules called /facebook_auth.

Before you get all click happy and start trying to activate it in Drupal, though, you also need to download the Facebook platform. Like the README says, you can currently find that at http://developers.facebook.com/clientlibs/facebook-platform.tar.gz.

And here's one of those places where the current README falls a little short. It tells you to extract the files from that tarball, but it doesn't say where. Not helpful. You'll want to extract the contents of that file into the facebook_auth directory. After you've done so, your directory structure should look something like this:

/modules/facebook_auth/LICENSE.txt<br />
/modules/facebook_auth/README<br />
/modules/facebook_auth/facebook_auth.info<br />
/modules/facebook_auth/facebook_auth.module<br />
/modules/facebook_auth/img/<br />
/modules/facebook_auth/facebook-platform/<br />

and within the facebook-platform directory:

 
/modules/facebook_auth/facebook-platform/README <br />
/modules/facebook_auth/facebook-platform/client/ <br />
/modules/facebook_auth/facebook-platform/footprints/ <br />
/modules/facebook_auth/facebook-platform/php4client/ <br />

Obviously, there are files in the client, footprints, and php4client directories, too.

Ok, for this all to work, you also need to get yourself a Facebook API Key. Assuming you don't have any apps registered...

  1. Browse to http://www.facebook.com/developers/apps.php and logon with your Facebook account info.
  2. Click "Apply for a key."
  3. Give a descriptive application name. Your users will see this when they try to use Facebook authentication, so you probably won't want to call it "Shiny Baboon Ass" (unless, of course, that's your domain name...). I'd suggest your site's title, but that's just me.
  4. Click Optional Fields to expand it.
  1. Customize the Support Email address field, unless, of course, you want your visitors sending their complaints to the email address you use for Facebook.
  2. Enter http://<yourdomainname>/facebook/ for the Callback Url. For instance, ours would be http://www.nerdliness.com/facebook/.
  3. Make sure Application Type is Website.
  4. Fiddle with any other settings you want, but be careful if you enter any IP Address of Servers Making Requests. Obviously, if you enter the wrong info, your app won't work.
  5. Click Submit.

You should now see an API Key and a Secret. Keep those handy as you'll need them in the facebook_auth configuration. There's a config.php file in the /modules/facebook_auth/facebook-platform/footprints directory that asks for them, but you don't need to worry about that. All you need to do is configure the module properly inside Drupal.

Those are the hard parts. From here on out, everything else is like you'd expect for a new module:

  1. Log on to your Drupal install as an account that can activate modules.
  2. Activate the newly installed module in Adminster->Site Building->Modules.
  3. Enter your API Key and Secret in Adminster->Site Configuration->Configure Facebook settings (and probably check the "Show button in login block" box, but that's up to you).

And that's it. If everything went according to Hoyle, your site should now allow users to logon using their Facebook creds.

How it Works

Ok, so now you have a Facebook button on your /user page. So what? Let's say a new user comes along and clicks that button. That user will be redirected to the Facebook site temporarily to enter their Facebook credentials. They'll also have the option to check a couple of boxes allowing your app to access their Facebook info (this is the screen where that Shiny Baboon Ass will appear...). Soon as they click that button, the facebook_auth module will create a new local Drupal account on your site associated with that Facebook account.

Couple of caveats. First, the facebook_auth module doesn't seem to pull much info from their Facebook account. After creating a test user in our sandbox, the new account didn't have an email address, etc. entered into our users table. That might be an issue for some, but seems like one that can be fixed in the module. I haven't investigated the Facebook API enough to know for sure yet, though. Still, though, if you have mandatory profile fields you expect everyone to fill out, you might be a little disappointed to find new users missing that data.

Second, this is a quick way to accidentally create multiple local Drupal accounts for the same user. For instance, I obviously have a local Drupal account on my box already. I also have a separate Facebook account. If I were to click the Facebook button and attempt to authenticate with my Facebook name/password, I'd end up creating a second Drupal account instead of logging in with my original.

You can get around that a bit by making sure your existing users know about the Facebook Identities tab the module adds to your user profiles. If you log in to Drupal as an existing user, you can associate your existing Drupal account with your existing Facebook account ahead of time, thus avoiding the duplicate user problem.

The Rest

If you click our Log In link in the upper-right, you might notice, well, nothing new. No Facebook button. Yep. Like I mentioned, that there module's still in development and we'll need to do some more testing before we dare push it to our live site.

There are a few things we'd like to see added to the module, too. For instance, it would be nice if the module could prevent those duplicate accounts somehow... maybe by simply throwing up a warning to people letting them know what they should do if they already have a local Drupal account. Of course, that once can be nipped by throwing a warning on the site itself.

All in all, though, it definitely looks promising. We'll be keeping an eye on it.

Your rating: None

Comments

Great writeup!

I've been meaning to give this module a run. Thanks for the detailed info. I'm really excited for the possibilities this module opens up when it's more flushed out. I want to use it on my friend's bands website I just built in Drupal. They have a large fan base already on facebook so allowing their listeners to log into their site with an already established account will definitely make people more inclined to use the site without the hassle of registering

Totally...

I only recently really started using Facebook at all, and even now I barely dabble.  Still, though, even I know that every dude and his dog is on there, and if we can manage to leverage that power, we'd be happy to. 

I can't wait to see the direction halkeye takes with it.  Let's all make sure to give him the props he deserves for the work he's put into it, too.

 

Kick ASS

Wow, thanks so much for doing what you have so far. Seriously, you are kick ASS. I'm replying before reading too! Just very thankful for you actually doing so much off my request. Thanks!

Thanks, Evan! One of our

Thanks, Evan!

One of our plans for the site is to add an Ask a Nerd form just for this kind of thing.  Obviously, we'd never be able to get to everything, but we'd still love to get input on the stuff people are interested in.  Judging by our recent logs, it's pretty clear that there's a lot of Drupal love out there, so I'm sure as least a couple of us will continue milkin' that for awhile. 

no e-mail

FYI... The reason why the e-mail address isn't included is because that info isn't available in the Facebook API to prevent spam.

I get it, but...

I totally understand why they wouldn't do it...  After all, if they did, any wack-job who signed up for a API key could potentially access all the email addresses for Facebook users, right?

On the other hand, the Facebook login screen does explicitly tell users that they'll be giving access (see images below) to their personal information to the people who wrote the application and gives them a little checkbox to approve it, so it looks like they've got their bases covered well enough to allow developers access to that info.

 

For now, it really doesn't affect Nerdliness.  After all, nobody outside our fearsome nerdly foursome gains anything from registering right now, so there's no real point in us spending a lot of time trying to perfect Facebook interaction.  Just a fun exercise.

 

Updates

hey i've updated the module now.

I remember you messaged me a while back about helping to add some nice documentation for the module. I'd love that, but i wanted to get these updates in first.

If you are still interested i'll gladly work with you and provide a link from both the readme and the project page.

 

Gavin

 

(ps, its annoying i can't hit tab to get out of this editor thingie)

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <div><span><br /><blockquote><table><thead><th><tr><td><form><input><h1><h2> <h3> <h4> <h5> <h6> <img> <p> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd><i>
  • Lines and paragraphs break automatically.
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>. Beside the tag style "<foo>" it is also possible to use "[foo]".

More information about formatting options