TW3 — Technologies du Web 3

Atelier — monter une API Express pas à pas

Mise en pratique assistée : structurer un routeur express.Router, enchaîner les middlewares et protéger une route avec un middleware d'authentification maison.

Cet atelier met en pratique les concepts du chapitre (routing, middlewares, auth). On part d'un projet vide et on monte une petite API /api/articles protégée, étape par étape. Chaque étape est à taper puis à tester avant de passer à la suivante.

🛠️ Étape 1 — Initialiser et démarrer

Créez le projet et installez Express (avec "type": "module" pour utiliser import).

npm init -y
npm install express

Ajoutez "type": "module" dans package.json, puis créez src/server.js avec le serveur minimal du chapitre :

import express from "express";

const app = express();
app.get("/api/ping", (req, res) => res.json({ message: "pong" }));
app.listen(3000, () => console.log("API sur http://localhost:3000"));

Lancez et vérifiez :

node src/server.js
curl -i http://localhost:3000/api/ping

🛤️ Étape 2 — Structurer avec express.Router

Au lieu d'enregistrer toutes les routes sur app, on les regroupe dans un routeur dédié. Cela sépare la déclaration des routes de la configuration générale.

// src/routes/articles.js
import { Router } from "express";
const router = Router();

const articles = [{ id: 1, titre: "Hello" }];

router.get("/", (req, res) => res.json(articles));
router.get("/:id", (req, res) => {
  const article = articles.find((a) => a.id === Number(req.params.id));
  if (!article) return res.status(404).json({ error: "Introuvable" });
  res.json(article);
});

export default router;

Branchez le routeur sur app (dans src/server.js) :

import articlesRouter from "./routes/articles.js";
app.use(express.json());
app.use("/api/articles", articlesRouter);

express.json() doit être déclaré avant le routeur, sinon req.body serait undefined dans les routes POST.

🔐 Étape 3 — Protéger une route avec un middleware maison

Créez le middleware d'authentification vu en Apport (src/middlewares/auth.js), puis protégez la création d'article :

// src/routes/articles.js
import { authentifier, exigerRole } from "../middlewares/auth.js";

router.post("/", authentifier, exigerRole("admin"), (req, res) => {
  const article = { id: Date.now(), ...req.body };
  articles.push(article);
  res.status(201).json(article);
});

Testez sans jeton (attendu 401), puis avec un jeton valide (Bearer abc123) et le rôle admin (attendu 201).

🧪 Étape 4 — Tester et observer l'ordre

L'ordre d'enregistrement des middlewares décide du comportement. Vérifiez avec curl :

# liste (publique)
curl http://localhost:3000/api/articles

# création sans jeton -> 401
curl -X POST http://localhost:3000/api/articles \
  -H "Content-Type: application/json" \
  -d '{"titre":"Test"}'

# création avec jeton admin -> 201
curl -X POST http://localhost:3000/api/articles \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer abc123" \
  -d '{"titre":"Test"}'

✅ Ce que vous avez mis en pratique

  • un routeur express.Router() pour isoler les routes d'un domaine ;
  • l'enchaînement middleware → contrôleur sur une route ;
  • un middleware d'auth maison (authentifier, exigerRole) appliqué uniquement à la route sensible ;
  • l'importance de l'ordre (express.json() avant les routes).

Vous pouvez reprendre ce squelette dans l'exercice de fin de chapitre pour ajouter la gestion d'erreurs centralisée et un middleware 404.

Express

Terminez le quiz du chapitre pour le marquer comme complété.

Tableau de bord

On this page