Skip to content

node.js with express, quick facebook connect tutorial

This is a super quick tutorial on how to implement “login with facebook” using the Facebook JavaScript SDK. Bits of this tutorial were taken from the Facebook connect example. To begin, lets install express:

npm install express

Now let’s create an app.js file which we will use to create the server.

var app = require('express').createServer();

// routing
app.get('/', function (req, res) {
  res.sendfile(__dirname + '/index.html');
});

app.listen(8080);

Now in the index.html file, we must first include 2 scripts – jQuery and the Facbeook SDK. The app, first gets initialized with facebook by sending the API Key. Then, we query for the login status to see if we are currently logged in and/or user authorized the app for logins. We add a couple listeners for button clicks, and write the session response function. There is a console.log in there so you can see all that actually gets returned.

<!doctype html>
<html>
<head>
   <title>nodejs - facebook</title>
</head>
<body>
	<div>
           <button id="login">Login</button>
           <button id="logout">Logout</button>
	</div>
    <br>
    <span id="user-info" style="border:1px solid #888"></span>
    <span id="fb-root"></span>

    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.min.js"></script>
    <script src="http://connect.facebook.net/en_US/all.js"></script>
    <script>
        // initialize the library with the API key
        FB.init({ appId:'YOUR_APP_ID' });

        // fetch the status on load
        FB.getLoginStatus(handleSessionResponse);

        $('#login').bind('click', function() {
            FB.login(handleSessionResponse);
        });

        $('#logout').bind('click', function() {
            FB.logout(handleSessionResponse);
        });

        // handle a session response from any of the auth related calls
        function handleSessionResponse() {
            FB.api('/me', function(response) {
                console.log(response);
                $('#user-info').html(response.id + ' - ' + response.name);
            });
        }
    </script>
</body>
</html>

Now just load up

node app.js

and go to localhost:8080.

Comment Feed

4 Responses

  1. so can you write some tutorial that will have: facebook api, mongodb, socket.io , express and jade ?

    • michael mukhinMay 23, 2012 @ 10:51 pmReply

      the individual explanations are already here (other articles), it would be much better for you to combine them and create this tutorial / application yourself. :)

  2. That is great but imagine we want to create a facebook connect based chat on this, it is not secure if we want to send the facebook infos through an ajax request for instance. We need to send these info to the server so i do not know exactly how to send thrusted infos (if you send a json object it can be modified).

    I mean, we need something server side to check all of that or ask facebook through the server if possible.

    Do you have any idea about that? Thanks



Some HTML is OK

or, reply to this post via trackback.

CAPTCHA Image
*