Authentication Strategies in Express.js (OAuth, OpenID Connect)

Authentication is a critical part of any web application, ensuring that only authorized users can access resources or services. In modern web applications, using authentication protocols like OAuth and OpenID Connect (OIDC) has become essential for secure and user-friendly authentication.

Introduction to Authentication and Authorization

Authentication is the process of verifying a user’s identity, while authorization determines what a user is allowed to do. In a typical web application, authentication is often performed with:

  • Username and password: Basic but limited and less secure.
  • OAuth: Allows users to sign in using third-party providers (e.g., Google, Facebook).
  • OpenID Connect (OIDC): Extends OAuth to provide authentication with identity verification.

These methods are ideal for Express.js applications because they offer a secure and scalable way to handle authentication.

Overview of OAuth and OpenID Connect

OAuth 2.0 is an authorization protocol that enables third-party applications to access resources on behalf of a user. For example, an app may request access to a user’s Google profile, calendar, or contacts.

OpenID Connect (OIDC) is an authentication layer on top of OAuth 2.0, allowing applications to verify a user’s identity and gain basic profile information in addition to authorization. OIDC is preferred for handling user sign-ins because it provides reliable identity verification and secure access to user data.

Setting Up an Express.js Application for Authentication

To start, let’s create a simple Express.js application to demonstrate OAuth and OpenID Connect:

1. Initialize a Project:

				
					mkdir express-auth-app
cd express-auth-app
npm init -y
npm install express passport passport-google-oauth20 express-session

2. Basic Express Server:

Create an app.js file with a basic Express server setup:

				
					// app.js
const express = require('express');
const session = require('express-session');
const app = express();

app.use(session({ secret: 'your_secret_key', resave: false, saveUninitialized: true }));

app.get('/', (req, res) => {
    res.send('Welcome to the Express.js Authentication App');
});

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
    console.log(`Server is running on port ${PORT}`);
});

Explanation:

  • express-session: Used to manage session data for logged-in users.
  • Basic route (/) to confirm the server is running

Implementing OAuth 2.0 with Express.js

OAuth 2.0 allows users to grant limited access to their resources without sharing credentials. This flow is handled with a redirect to the OAuth provider, where the user authorizes access.

Basic Flow of OAuth

  1. User clicks login: Redirects to an OAuth provider (e.g., Google).
  2. User authorizes: Provider asks the user to grant permissions.
  3. Authorization code: After granting permission, the provider sends an authorization code to your app.
  4. Token exchange: Your app exchanges the code for an access token.
  5. Access user data: Use the token to access authorized resources.

Code Example: Google OAuth with Passport.js

1. Configure Google OAuth: In the Google Developer Console, create an OAuth client and set up authorized redirect URIs.

2. Install Passport.js and Google OAuth Strategy

				
					npm install passport-google-oauth20

3. Setting Up the Google OAuth Strategy:

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

passport.use(new GoogleStrategy({
    clientID: 'YOUR_GOOGLE_CLIENT_ID',
    clientSecret: 'YOUR_GOOGLE_CLIENT_SECRET',
    callbackURL: 'http://localhost:3000/auth/google/callback'
},
(accessToken, refreshToken, profile, done) => {
    // This is where you handle the user profile returned from Google
    return done(null, profile);
}));

// Serialize and Deserialize User
passport.serializeUser((user, done) => done(null, user));
passport.deserializeUser((user, done) => done(null, user));

app.use(passport.initialize());
app.use(passport.session());

// Route to initiate OAuth with Google
app.get('/auth/google', passport.authenticate('google', { scope: ['profile'] }));

// Callback route for Google to redirect after authentication
app.get('/auth/google/callback',
    passport.authenticate('google', { failureRedirect: '/' }),
    (req, res) => {
        res.redirect('/profile');
    }
);

// Profile Route
app.get('/profile', (req, res) => {
    res.send(`Hello, ${req.user.displayName}`);
});

Explanation:

  • GoogleStrategy: Configures OAuth 2.0 flow with Google, using clientID, clientSecret, and callbackURL.
  • passport.authenticate('google'): Initiates OAuth login with Google.
  • auth/google/callback: Handles the callback, authenticating the user and redirecting to /profile.

Output:

  • After login, the user is redirected to /profile, where they see a personalized message.

Implementing OpenID Connect with Express.js

OIDC builds on OAuth 2.0 but focuses on verifying user identity, making it more suitable for handling sign-ins.

  1. Understanding the OIDC Flow:

    • User logs in via the OIDC provider.
    • Application receives an ID token and an access token.
    • Application uses the ID token to identify the user and the access token to access additional resources.

  2. Code Example: Google OpenID Connect with Passport.js:

    This implementation is similar to OAuth but requests an ID token instead

				
					app.get('/auth/google', passport.authenticate('google', { scope: ['openid', 'profile', 'email'] }));

Explanation:

  • Adding openid and email scopes requests an ID token, allowing user identification.

Using Passport.js for Simplified Authentication

Passport.js is a popular authentication middleware for Node.js, simplifying the implementation of OAuth and OIDC.

  1. Session Management: Passport provides easy session management.
  2. Strategies: Use different authentication strategies (e.g., Google, Facebook, GitHub).

Storing Authentication Data Securely

When using OAuth or OIDC, it’s essential to store tokens securely to protect user data.

  • Environment Variables: Store sensitive keys (like clientID and clientSecret) in environment variables.
  • Encrypted Storage: For production, use encrypted storage solutions for tokens.
  • Session Management: Use secure session cookies with express-session and passport to handle user sessions.

OAuth and OpenID Connect provide secure, standardized ways to handle authentication in modern web applications. With OAuth, you can access third-party data on behalf of users, while OIDC allows for safe, identity-based login. Express.js applications benefit greatly from integrating these protocols through middleware like Passport.js, which simplifies the process and enhances security. Happy Coding!❤️

Table of Contents

Home
Roadmap
ATS Resume
Playground
Resources