Implementing OAuth with NestJS: A Step-by-Step Guide

Implementing OAuth with NestJS: A Step-by-Step Guide

OAuth is an industry-standard protocol for authorization, enabling secure and controlled access to protected resources without sharing credentials. Implementing OAuth in a NestJS application is straightforward due to the framework's modular and flexible structure. This tutorial provides a step-by-step guide to integrating OAuth with NestJS.

What is OAuth?

OAuth (Open Authorization) allows users to grant third-party applications access to their resources on another platform without exposing their credentials. For example, logging into an application using Google, Facebook, or GitHub is commonly powered by OAuth.

Why Use OAuth in Your NestJS Application?

1. Secure Authorization: Avoid handling sensitive user credentials directly.
2. Seamless User Experience: Enable users to log in using existing accounts from providers like Google, GitHub, or Facebook.
3. Scalable Authentication: Easily manage multiple OAuth providers and scale your app's user authentication.

Step-by-Step Guide to Implement OAuth in NestJS

Step 1: Initialize a New NestJS Project

Start by creating a fresh NestJS application or use an existing one.

bash

npm i -g @nestjs/cli
nest new oauth-demo

Choose your preferred package manager during the setup process.

Step 2: Install Required Packages

To implement OAuth, you’ll need Passport.js and its OAuth strategy. Install the necessary dependencies:

bash

npm install @nestjs/passport passport passport-oauth2 @types/passport-oauth2

Additionally, install the @nestjs/jwt and passport-jwt packages if you plan to issue JWTs after successful OAuth authentication.

bash

npm install @nestjs/jwt passport-jwt @types/passport-jwt

Step 3: Configure Your OAuth Provider

Set up your OAuth provider (e.g., Google, GitHub) by creating a new app in their developer console. You’ll need:

• Client ID
• Client Secret
• Redirect URI (e.g., http://localhost:3000/auth/callback)

Step 4: Create the OAuth Strategy

Create a custom OAuth strategy to handle the authentication flow.

Generate the Strategy File

bash

nest g service auth

Implement OAuth Strategy

In auth.service.ts, implement the logic:

typescript

import { Injectable } from '@nestjs/common';
import { PassportStrategy } from '@nestjs/passport';
import { Strategy } from 'passport-oauth2';

@Injectable()
export class OAuthStrategy extends PassportStrategy(Strategy, 'oauth') {
  constructor() {
    super({
      authorizationURL: 'https://example.com/oauth/authorize',
      tokenURL: 'https://example.com/oauth/token',
      clientID: 'YOUR_CLIENT_ID',
      clientSecret: 'YOUR_CLIENT_SECRET',
      callbackURL: 'http://localhost:3000/auth/callback',
    });
  }

  async validate(accessToken: string, refreshToken: string, profile: any): Promise<any> {
    // Use the profile data to create or validate the user in your database
    return { accessToken, profile };
  }
}

Step 5: Create the Auth Module

Create an authentication module to organize your OAuth functionality.

bash

nest g module auth

Integrate the OAuthStrategy along with other required components into the AuthModule.

auth.module.ts

typescript

import { Module } from '@nestjs/common';
import { PassportModule } from '@nestjs/passport';
import { OAuthStrategy } from './auth.service';

@Module({
  imports: [PassportModule.register({ defaultStrategy: 'oauth' })],
  providers: [OAuthStrategy],
})
export class AuthModule {}

Step 6: Set Up Routes and Controllers

Define routes for handling the OAuth flow, including login and callback.

auth.controller.ts

typescript

import { Controller, Get, Req, UseGuards } from '@nestjs/common';
import { AuthGuard } from '@nestjs/passport';

@Controller('auth')
export class AuthController {
  @Get('login')
  @UseGuards(AuthGuard('oauth'))
  async login() {
    // This route will redirect the user to the OAuth provider
  }

  @Get('callback')
  @UseGuards(AuthGuard('oauth'))
  async callback(@Req() req) {
    // Access the user information from the request
    return req.user;
  }
}

Step 7: Configure the Application Module

Integrate the AuthModule into your AppModule.

app.module.ts

typescript

import { Module } from '@nestjs/common';
import { AuthModule } from './auth/auth.module';

@Module({
  imports: [AuthModule],
})
export class AppModule {}

Step 8: Test the Application

Run the NestJS application:

bash

npm run start

Visit http://localhost:3000/auth/login to initiate the OAuth flow. After successful authentication, you’ll be redirected to the callback route with the user profile data.

Enhancing Your OAuth Implementation

1. Issue JWT Tokens
   
   Use @nestjs/jwt to issue JWTs for authenticated users.

   typescript
   
   import { JwtService } from '@nestjs/jwt';
   
   constructor(private readonly jwtService: JwtService) {}
   
   async validate(accessToken: string, profile: any): Promise<any> {
       const payload = { username: profile.username, sub: profile.id };
       return this.jwtService.sign(payload);
   }
   
   

2. Store User Information
   Save user details to your database for future use.

3. Handle Errors Gracefully
   Implement error handling for scenarios like invalid tokens or expired sessions.

Conclusion

Integrating OAuth with NestJS streamlines the authentication process while enhancing security and user convenience. By leveraging Passport.js and following this guide, you can seamlessly integrate popular OAuth providers like Google, GitHub, or Facebook into your NestJS application.