Redirections

Fait partie de la section Les bases d’Express du Journey Node.js de Coddy. Leçon 12 sur 23.

Les pages changent d’adresse, et les anciens liens dans les favoris et les résultats de recherche doivent toujours mener quelque part.

app.get('/old-prices', (req, res) => {
    res.redirect(301, '/prices');
});

Une redirection renvoie un statut et un en-tête Location indiquant la nouvelle URL, et le navigateur demande aussitôt cette URL. res.redirect définit les deux.

Le statut indique combien de temps dure le changement d’adresse. 301 signifie que le changement est définitif : les navigateurs et les moteurs de recherche mémorisent la nouvelle adresse et cessent de demander l’ancienne. 302, le statut par défaut si tu n’en indiques aucun, signifie que le changement est temporaire, donc ils continuent d’utiliser l’ancienne URL.

Défi

Facile

Les anciennes pages du menu ont été définitivement remplacées par les pages des recettes, et les anciens favoris devraient toujours fonctionner.

Dans server.js, ajoute une route pour /menu qui redirige vers /recipes avec le statut 301, ce qui signifie que la page a été définitivement déplacée.
Ajoute une route pour /menu/:id qui redirige vers la page de la recette portant le même identifiant, également avec le statut 301 : /menu/3 mène à /recipes/3.

Essaie : Appuie sur Run et envoie /menu/3. Tu devrais voir le statut 301 et un en-tête Location contenant /recipes/3. Envoie /menu : 301 avec Location /recipes. Envoie /menu/42 : 301 avec Location /recipes/42. La redirection ne vérifie pas si la recette 42 existe ; /recipes/42 répond ensuite lui-même avec le statut 404.

Essayez vous-même

import { escapeHtml } from './html.js';
import express from 'express';
import { recipes } from './data.js';

const app = express();

app.use(express.static('public'));

app.get('/', (req, res) => {
    const items = recipes.map((r) => `<li><a href="/recipes/${r.id}">${escapeHtml(r.title)}</a></li>`);
    res.send(`<link rel="stylesheet" href="/style.css"><h1>Recipe Box</h1><ul>${items.join('')}</ul>`);
});

// type('text') envoie du texte brut, donc chaque titre apparaît sur sa propre ligne.
app.get('/recipes', (req, res) => {
    const { tag } = req.query;
    const list = tag ? recipes.filter((recipe) => recipe.tags.includes(tag)) : recipes;
    res.type('text').send(list.map((recipe) => recipe.title).join('\n'));
});

app.get('/recipes/:id', (req, res) => {
    const recipe = recipes.find((r) => r.id === Number(req.params.id));
    if (!recipe) {
        res.status(404).send('No such recipe');
        return;
    }
    res.send(recipe.title);
});

app.get('/api/recipes', (req, res) => {
    res.json(recipes);
});

app.get('/api/recipes/:id', (req, res) => {
    const recipe = recipes.find((r) => r.id === Number(req.params.id));
    if (!recipe) {
        res.status(404).json({ error: 'No such recipe' });
        return;
    }
    res.json(recipe);
});

app.get('/about', (req, res) => {
    res.send('Recipe Box collects family recipes.');
});

app.listen(3000, () => {
    console.log('Recipe Box is running on port 3000');
});