Friday, June 11th, 2010

How to Authenticate Users With Facebook Connect

If you like it, say thanks by sharing it

Lately, there’s been quite a fuzz about lazy registration. It turns out that the less the user has to think, the higher the conversion rates are! What a thought! If everybody seems to have a Facebook profile, why not add a one-click user registration? I’ll show you how to do that today.


Step 1. The Setup

MySQL Table

Let’s begin by creating a database table.

CREATE TABLE `users` ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT, `oauth_provider` varchar(10), `oauth_uid` text, `username` text, PRIMARY KEY (`id`) ) ENGINE=MyISAM  DEFAULT CHARSET=latin1; 

Quite simple: we will be setting up a table for user information with id, username, first and last name, the URL to the user’s picture, and registered date. Also, we’re adding both an oauth_provider and oauth_uid fields, to distinguish between different third party open authentication protocols and their identifiers. For example, let’s say that, next week, you decide that it’s a good idea to also let Twitter users in. Easy; you just set another value to the oauthprovider, and avoid duplicating oauthuid values.

The Facebook App

Let’s begin by creating a new application. Give it a name and agree to the terms and conditions. Next, grab both the API Key and Secret in the basic tab as shown below.

On the canvas tab, set both the Canvas URL and Post-Authorize Redirect URL to your localhost and path that the script will process — something like http://localhost.com/login_facebook.php?. Note the question mark at the end and the domain; both are required by Facebook. Simply set your hosts file to a valid domain name.

On the connect tab, set the Connect URL to the same value and set localhost.com (or the one you are using) as the Base Domain.

Now save, download the client library, and unzip facebook.php in the srcdir to a new directory created in the root.


continue reading…

If you like it, say thanks by sharing it

Category: Graphics
You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
  • *