Adding OAuth and Social Logins

Tutorial 3 of 5

1. Introduction

This tutorial will guide you through the process of adding OAuth and social logins to your Node.js application. By integrating OAuth and social logins, your users can authenticate using their existing credentials from a social media provider (like Google or Facebook), which improves the user experience and security.

By the end of this tutorial, you will learn:

What OAuth is and how it works
How to add Google and Facebook login to a Node.js application

This tutorial assumes you have knowledge of:

Basic JavaScript and Node.js
Basic understanding of Express.js

2. Step-by-Step Guide

OAuth

OAuth is an open-standard authorization protocol that provides applications the ability for "secure designated access." In simpler terms, it lets users authorize applications to access their accounts without sharing their passwords.

Adding Google Login

To add Google login, you first need to create a project in the Google Developer Console and get your Client ID and Secret.

Then, in your Node.js application, you can use the passport-google-oauth20 library. The library's Strategy method requires a verify callback, which accepts an accessToken, refreshToken, and profile from Google, then calls done to continue the middleware chain.

Adding Facebook Login

The process for adding Facebook login is similar. You'll need to create an app in the Facebook Developers section to get your App ID and Secret.

Facebook login can be implemented with the passport-facebook library, using the Strategy method, which also requires a verify callback.

3. Code Examples

Google Login Example

First, install the library:

npm install passport-google-oauth20

Then, configure the strategy:

const GoogleStrategy = require('passport-google-oauth20').Strategy;

passport.use(new GoogleStrategy({
    clientID: GOOGLE_CLIENT_ID,
    clientSecret: GOOGLE_CLIENT_SECRET,
    callbackURL: "http://yourwebsite.com/auth/google/callback"
  },
  function(accessToken, refreshToken, profile, done) {
    // Use the profile info (mainly profile id) to check if the user is registered in your database
    // If not, create a new user
    // At the end of this callback, call done to continue the middleware chain
  }
));

Facebook Login Example

Install the library:

npm install passport-facebook

Configure the strategy:

const FacebookStrategy = require('passport-facebook').Strategy;

passport.use(new FacebookStrategy({
    clientID: FACEBOOK_APP_ID,
    clientSecret: FACEBOOK_APP_SECRET,
    callbackURL: "http://yourwebsite.com/auth/facebook/callback"
  },
  function(accessToken, refreshToken, profile, done) {
    // Similar to Google, check or create the user in your database here
    // Call done at the end
  }
));

4. Summary

In this tutorial, you've learned what OAuth is and how to implement Google and Facebook logins in a Node.js application using the Passport.js library.

Next, you could explore adding other social logins, or improving the user experience by customizing the login UI.

Additional resources:

5. Practice Exercises

Implement Twitter login using the passport-twitter library.
Implement LinkedIn login using the passport-linkedin-oauth2 library.
Improve the UI of your login page to make it more user-friendly.

Remember to always review the official documentation of each library and API you're using. Happy coding!