0Pricing
Next.js 15 Fullstack (App Router + Server Actions) · Leçon

Gardes et rôles

Utilisez les gardes de NestJS pour protéger les routes et mettez en œuvre un contrôle d’accès fondé sur les rôles (RBAC) afin de gérer les autorisations des utilisateurs.

Gardes et rôles est une leçon Next.js 15 Fullstack (App Router + Server Actions) gratuite sur CoddyKit. Ceci est la leçon 4 sur 6. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Next.js 15 Fullstack (App Router + Server Actions), et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Next.js 15 Fullstack (App Router + Server Actions) comprend 6 leçons au total.

Certaines parties de cette leçon n'ont pas encore été traduites et s'affichent en anglais.

What are NestJS Guards?

In NestJS, Guards are special classes that decide if a given request should be processed by the route handler. Think of them as gatekeepers!

They sit between the incoming request and your application's logic, making authorization decisions.

  • Authorization: Who is allowed to do what?
  • Authentication: Who is this user? (Often handled before guards, but guards can confirm it).

Building a Basic Guard

All NestJS Guards must implement the CanActivate interface. This interface requires a single method: canActivate().

The canActivate() method returns a boolean, a Promise<boolean>, or an Observable<boolean>. If it returns true, the request proceeds; if false, it's blocked.

import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
import { Observable } from 'rxjs';

@Injectable()
export class AuthGuard implements CanActivate {
  canActivate(
    context: ExecutionContext,
  ): boolean | Promise<boolean> | Observable<boolean> {
    // Logic to determine if user is authorized
    // For now, let's just allow it
    return true;
  }
}

A Simple Authentication Check

Let's make our AuthGuard actually do something! We'll simulate checking if a user is 'logged in' by looking for a specific header.

The ExecutionContext provides access to the request, response, and more, allowing us to inspect the incoming request.

import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
import { Observable } from 'rxjs';

@Injectable()
export class BasicAuthGuard implements CanActivate {
  canActivate(
    context: ExecutionContext,
  ): boolean | Promise<boolean> | Observable<boolean> {
    const request = context.switchToHttp().getRequest();
    // In a real app, you'd check JWT, session, etc.
    // For this example, we check a simple header.
    const hasAuthHeader = request.headers['authorization'] === 'Bearer secret-token';
    return hasAuthHeader; // Only allow if header is correct
  }
}

Protecting Your Endpoints

To apply a guard, you use the @UseGuards() decorator. You can apply it to a single route handler or to an entire controller.

When applied to a controller, all routes within that controller will be protected by the guard.

import { Controller, Get, UseGuards } from '@nestjs/common';
import { BasicAuthGuard } from './common/guards/auth.guard';

@Controller('protected')
@UseGuards(BasicAuthGuard) // Protects all routes in this controller
export class ProtectedController {
  @Get()
  getProtectedData(): string {
    return 'This data is protected!';
  }

  @Get('public')
  getAnotherProtectedData(): string {
    return 'More protected data.';
  }
}

// src/app.module.ts
import { Module } from '@nestjs/common';
import { ProtectedController } from './app.controller';

@Module({
  controllers: [ProtectedController],
  providers: [],
})
export class AppModule {}

// src/main.ts
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
  console.log('App running on http://localhost:3000');
}
bootstrap();

Understanding RBAC

While basic authentication checks if a user is who they say they are, Role-Based Access Control (RBAC) checks what they are allowed to do.

With RBAC, users are assigned roles (e.g., 'admin', 'editor', 'viewer'), and permissions are granted to roles, not individual users.

  • Role: A collection of permissions (e.g., 'admin' can 'create', 'read', 'update', 'delete').
  • User: Assigned one or more roles.
  • Resource: The data or functionality being accessed.

Marking Routes with Roles

To implement RBAC, we need a way to tell our guard which roles are allowed for a specific route. NestJS allows us to create custom decorators for this!

We'll create an @Roles() decorator to attach role metadata to our route handlers.

import { SetMetadata } from '@nestjs/common';

export const ROLES_KEY = 'roles';
export const Roles = (...roles: string[]) => SetMetadata(ROLES_KEY, roles);

// Example usage in a controller:
// @Roles('admin', 'editor')
// @Get('admin-only')
// someAdminMethod() { ... }

The Roles Guard Logic

Now, let's build our RolesGuard. This guard will:

  1. Get the required roles from the route's metadata using the Reflector.
  2. Get the user's roles (e.g., from the request object after authentication).
  3. Compare them to see if the user has any of the required roles.
import { Injectable, CanActivate, ExecutionContext } from '@nestjs/common';
import { Reflector } from '@nestjs/core';
import { Observable } from 'rxjs';
import { ROLES_KEY } from '../decorators/roles.decorator';

@Injectable()
export class RolesGuard implements CanActivate {
  constructor(private reflector: Reflector) {}

  canActivate(
    context: ExecutionContext,
  ): boolean | Promise<boolean> | Observable<boolean> {
    const requiredRoles = this.reflector.getAllAndOverride<string[]>(ROLES_KEY, [
      context.getHandler(),
      context.getClass(),
    ]);

    if (!requiredRoles) {
      return true; // No roles defined, so access is allowed by default
    }

    const request = context.switchToHttp().getRequest();
    // In a real app, 'user' would come from an authentication guard
    // and contain actual user data including roles.
    const user = request.user || { roles: ['viewer'] }; // Dummy user for example

    const hasPermission = requiredRoles.some((role) => user.roles.includes(role));
    return hasPermission;
  }
}

Stacking Guards for Protection

You can use multiple guards on a single route or controller. NestJS executes guards in the order they are listed in the @UseGuards() decorator.

If any guard returns false, the request is immediately blocked, and subsequent guards (and the route handler) are not executed.

  • First: Authentication (Is the user logged in?)
  • Second: Authorization (Does the user have the right role?)

Applying Guards and Roles

Let's see how our BasicAuthGuard, RolesGuard, and @Roles() decorator work together to protect an endpoint.

We'll simulate a user with the 'admin' role.

import { Controller, Get, UseGuards, Req } from '@nestjs/common';
import { BasicAuthGuard } from './common/guards/auth.guard';
import { RolesGuard } from './common/guards/roles.guard';
import { Roles } from './common/decorators/roles.decorator';

// Assume this comes from a real authentication process
interface User {
  username: string;
  roles: string[];
}

@Controller('admin')
@UseGuards(BasicAuthGuard, RolesGuard) // Guards applied in order
export class AdminController {
  @Get('dashboard')
  @Roles('admin') // Only users with 'admin' role can access
  getAdminDashboard(@Req() req): string {
    // For this runnable example's context, manually set user.
    // In a real app, BasicAuthGuard would populate req.user.
    req.user = { username: 'testuser', roles: ['admin'] };
    return `Welcome to the Admin Dashboard, ${req.user.username}!`;
  }

  @Get('reports')
  @Roles('admin', 'editor') // Admins or Editors can access
  getReports(@Req() req): string {
    req.user = { username: 'editoruser', roles: ['editor'] };
    return `Accessing reports as ${req.user.username}.`;
  }
}

// src/app.module.ts
import { Module } from '@nestjs/common';
import { AdminController } from './app.controller';

@Module({
  controllers: [AdminController],
  providers: [],
})
export class AppModule {}

// src/main.ts (unchanged from previous runnable example)
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
  console.log('Admin app running on http://localhost:3000');
}
bootstrap();

Guard & Role Check

Consider a NestJS route protected by @UseGuards(AuthGuard, RolesGuard) and @Roles('admin', 'moderator').

If a request comes in with a valid authentication token (passed by AuthGuard), but the authenticated user has only the role 'viewer', what will happen?

Guards & Roles Summary

Great job! In this lesson, you learned about:

  • NestJS Guards: Gatekeepers that implement CanActivate to control route access.
  • @UseGuards(): Decorator to apply guards at controller or method level.
  • Role-Based Access Control (RBAC): Managing permissions based on user roles.
  • Custom Decorators: Using @SetMetadata() to attach custom data (like roles) to routes.
  • Reflector: Used by guards to read metadata from routes.

Guards are powerful for authorization. Next, you might explore how to integrate Passport.js strategies for more robust authentication!

Questions Fréquemment Posées

La leçon « Gardes et rôles » est-elle gratuite ?

Oui — le texte complet de « Gardes et rôles » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Next.js 15 Fullstack (App Router + Server Actions), passe à CoddyKit PRO. Le cours Next.js 15 Fullstack (App Router + Server Actions) comprend 6 leçons au total.

Qu'est-ce que j'apprendrai dans « Gardes et rôles » ?

Utilisez les gardes de NestJS pour protéger les routes et mettez en œuvre un contrôle d’accès fondé sur les rôles (RBAC) afin de gérer les autorisations des utilisateurs. Tu pratiques Next.js 15 Fullstack (App Router + Server Actions) avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer Next.js 15 Fullstack (App Router + Server Actions) ?

Aucune expérience préalable n'est requise. Next.js 15 Fullstack (App Router + Server Actions) sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 4 sur 6.

Combien de temps prend la leçon « Gardes et rôles » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon Next.js 15 Fullstack (App Router + Server Actions) ?

Oui. Chaque leçon Next.js 15 Fullstack (App Router + Server Actions) inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

  1. Intégrer NextAuth.js
  2. Mise en œuvre d’une stratégie JWT
  3. Protéger les routes et les données
  4. Gardes et rôles
  5. Stratégies d’authentification personnalisées
  6. Intégration de Passport.js
← Retour à Next.js 15 Fullstack (App Router + Server Actions)