Einen Request-Body lesen

Teil des Abschnitts Express-Grundlagen der Node.js-Journey von Coddy. Lektion 15 von 23.

Eine POST-Anfrage sendet Daten in ihrem Body, und Express liest den Body nicht, solange du es nicht dazu aufforderst.

app.use(express.json());

app.post('/api/loans', (req, res) => {
    const { bookId, member } = req.body;
    res.status(201).json({ bookId, member, due: '2026-11-08' });
});

GET fordert etwas an; POST sendet etwas, das erstellt werden soll. express.json() ist Middleware, die jeden JSON-Body in req.body einliest. Ohne sie ist req.body undefined. Eine Route, die etwas erstellt, antwortet mit Statuscode 201 und dem, was sie erstellt hat.

Prüfe den Body, bevor du ihn speicherst. Ein fehlendes Feld ist ein Fehler des Clients, also antworte mit Statuscode 400 und speichere nichts.

Aufgabe

Einfach

Besucher können eigene Rezepte hinzufügen. Ein Programm sendet das neue Rezept als JSON im Body einer POST-Anfrage, und deine API speichert es.

Füge in server.js express.json() zusammen mit den anderen app.use-Zeilen oberhalb der Routen hinzu, damit ein JSON-Body in req.body ankommt.
Füge eine Route für POST-Anfragen an /api/recipes hinzu. Sie liest title und tags aus dem Body, zum Beispiel {"title": "Miso Soup", "tags": ["vegan", "soup"]}.
Sie erstellt das neue Rezept mit der nächsten Nummer als ID: Die vier Rezepte haben IDs von 1 bis 4, das erste neue bekommt also 5. Sie übernimmt den Titel und die Tags, die mitgesendet wurden. Wenn keine tags mitgesendet wurden, verwende eine leere Liste, [].
Sie fügt das Rezept zum recipes-Array hinzu, sodass GET /api/recipes es auflistet. Dann antwortet sie mit dem Status 201 und dem neuen Rezept als JSON: {"id": 5, "title": "Miso Soup", "tags": ["vegan", "soup"]}
Wenn der Body kein title enthält, speichert sie nichts und antwortet mit dem Status 400 und diesem JSON: {"error": "A recipe needs a title"}

Probiere es aus: Drücke auf „Ausführen“. Wähle POST im Methodenauswahlfeld, gib /api/recipes als Pfad ein und trage {"title": "Miso Soup", "tags": ["vegan", "soup"]} in das Body-Feld ein. Du solltest den Status 201 und das Rezept mit "id": 5 sehen. Wähle GET und sende /api/recipes: fünf Rezepte, mit Miso Soup als letztem. Sende dann per POST {"tags": ["dinner"]} an /api/recipes: Status 400 und {"error":"A recipe needs a title"}. GET /api/recipes listet weiterhin fünf Rezepte auf.

Probier es selbst

import { escapeHtml } from './html.js';
import express from 'express';
import { randomUUID } from 'node:crypto';
import { recipes } from './data.js';

const app = express();

app.use((req, res, next) => {
    console.log(`${req.method} ${req.url}`);
    next();
});

app.use((req, res, next) => {
    res.set('X-Request-Id', randomUUID());
    next();
});

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') sendet reinen Text, sodass jeder Titel in einer eigenen Zeile erscheint.
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.get('/menu', (req, res) => {
    res.redirect(301, '/recipes');
});

app.get('/menu/:id', (req, res) => {
    res.redirect(301, `/recipes/${req.params.id}`);
});

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