Création et sécurisation de l'authentification JWT dans une application Web

Introduction

Les jetons Web JSON (JWT) sont un moyen compact et autonome de transmettre en toute sécurité des informations entre les parties en tant qu'objet JSON. Les JWT sont largement utilisés pour authentifier les utilisateurs dans les applications Web. Dans ce tutoriel, nous allons créer un backend Node.js et Express avec l'authentification JWT.

Qu’est-ce que JWT ?

JWT (JSON Web Token) est un standard ouvert permettant de transmettre en toute sécurité des informations entre les parties en tant qu'objet JSON. Chaque jeton se compose de trois parties :

1. En-tête : contient des informations sur le type du jeton et l'algorithme de hachage.
2. Charge utile : contient les informations et les réclamations de l'utilisateur.
3. Signature : vérifie l'intégrité du jeton.

Exemple de JWT

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiIxMjM0IiwidXNlcm5hbWUiOiJqb2huZG9lIn0.H6BBiB1y5eXKXvW9bbjT2Rg8Jp4oE4Y5Kxf_sDF7Kzg

Mise en place du projet

1. Créez un nouveau répertoire de projet :
   

   mkdir jwt-auth-app
   cd jwt-auth-app
   

   Copier après la connexion

2. Initialiser un nouveau projet Node.js :
   

   npm init -y
   

   Copier après la connexion

Installation des dépendances

Installez les dépendances nécessaires :

npm install express jsonwebtoken bcryptjs dotenv express-validator

• express : Framework Web pour Node.js.
• jsonwebtoken : bibliothèque pour générer et vérifier des JWT.
• bcryptjs : bibliothèque pour hacher les mots de passe.
• dotenv : Pour les variables d'environnement.
• express-validator : pour valider les données d'entrée.

Configuration du serveur

Créez une configuration de serveur de base dans server.js :

// server.js
require('dotenv').config();
const express = require('express');
const app = express();
app.use(express.json());

// Import Routes
const authRoutes = require('./routes/auth');
app.use('/api/auth', authRoutes);

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

Créez un fichier .env pour stocker les variables d'environnement :

PORT=5000
JWT_SECRET=your_jwt_secret_key

Création de routes d'authentification utilisateur

1. Créez le fichier routes/auth.js pour les routes d'authentification :

// routes/auth.js
const express = require('express');
const { body, validationResult } = require('express-validator');
const bcrypt = require('bcryptjs');
const jwt = require('jsonwebtoken');
const router = express.Router();

const users = []; // In-memory user storage

// Signup Route
router.post(
  '/signup',
  [
    body('username').isLength({ min: 3 }),
    body('password').isLength({ min: 5 })
  ],
  async (req, res) => {
    const errors = validationResult(req);
    if (!errors.isEmpty()) return res.status(400).json({ errors: errors.array() });

    const { username, password } = req.body;
    const hashedPassword = await bcrypt.hash(password, 10);

    users.push({ username, password: hashedPassword });
    res.status(201).json({ message: 'User registered successfully' });
  }
);

// Login Route
router.post(
  '/login',
  [
    body('username').notEmpty(),
    body('password').notEmpty()
  ],
  async (req, res) => {
    const errors = validationResult(req);
    if (!errors.isEmpty()) return res.status(400).json({ errors: errors.array() });

    const { username, password } = req.body;
    const user = users.find(u => u.username === username);

    if (!user) return res.status(400).json({ message: 'Invalid credentials' });

    const isMatch = await bcrypt.compare(password, user.password);
    if (!isMatch) return res.status(400).json({ message: 'Invalid credentials' });

    const token = jwt.sign({ username }, process.env.JWT_SECRET, { expiresIn: '1h' });
    res.json({ token });
  }
);

module.exports = router;

1. Explication des itinéraires

• Route d'inscription : valide et hache le mot de passe avant de stocker l'utilisateur.
• Route de connexion : valide les informations d'identification, vérifie le mot de passe et émet un jeton JWT.

Générer des jetons JWT

• La méthode jwt.sign génère un jeton contenant les informations de l'utilisateur.
• Le JWT_SECRET est utilisé pour signer le jeton, qui doit rester sécurisé et privé.

const token = jwt.sign({ username }, process.env.JWT_SECRET, { expiresIn: '1h' });

Sécuriser les itinéraires avec JWT

Pour protéger les routes, créez un middleware pour vérifier les jetons.

1. Créer un middleware/auth.js :

// middleware/auth.js
const jwt = require('jsonwebtoken');

module.exports = function (req, res, next) {
  const token = req.header('Authorization')?.split(' ')[1];
  if (!token) return res.status(401).json({ message: 'Access denied' });

  try {
    const decoded = jwt.verify(token, process.env.JWT_SECRET);
    req.user = decoded;
    next();
  } catch (ex) {
    res.status(400).json({ message: 'Invalid token' });
  }
};

1. Protéger les routes dans server.js :

Créez un itinéraire protégé qui nécessite un jeton valide :

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiIxMjM0IiwidXNlcm5hbWUiOiJqb2huZG9lIn0.H6BBiB1y5eXKXvW9bbjT2Rg8Jp4oE4Y5Kxf_sDF7Kzg

Explication du middleware

• Le middleware vérifie la présence du token dans l'en-tête Authorization.
• Si le jeton est valide, les informations de l'utilisateur sont ajoutées à l'objet req, permettant l'accès à la route protégée.

Conclusion

Dans ce tutoriel, nous avons couvert les bases de la configuration de l'authentification JWT dans un backend Node.js et Express. Ce guide a démontré :

1. Configuration des routes d'authentification pour l'inscription et la connexion.
2. Création et vérification des jetons JWT.
3. Sécurisation des routes avec un middleware basé sur JWT.

Les JWT sont un moyen puissant de gérer l'authentification, rendant vos applications Web à la fois sécurisées et évolutives.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!