Menu
CoddyTech

Ersetzen mit PUT

Teil des Abschnitts REST-APIs der Node.js-Journey von Coddy. Lektion 5 von 25.

Ein Bearbeitungsformular sendet die gesamte Aufgabe zurück, jedes Feld auf einmal. PUT bedeutet „die Ressource hiermit ersetzen“, daher muss der Body vollständig sein.

PATCH /api/invoices/7  { "paid": true }               → paid changes
PUT   /api/invoices/7  { "amount": 90, "paid": true } → invoice 7 replaced
PUT   /api/invoices/7  { "paid": true }               → 400: amount missing

Ein PUT mit einem fehlenden Feld führt zu 400: Würde man die Rechnung nur teilweise ersetzen, ginge der Betrag verloren. Felder, die dem Server gehören, wie die id und der Erstellungszeitpunkt, stammen aus der alten Version, niemals aus dem Body:

const { id, issuedAt } = invoices[index];
invoices[index] = { id, amount, paid, issuedAt };
challenge icon

Aufgabe

Einfach

Ein Bearbeitungsformular sendet die gesamte Aufgabe auf einmal zurück. Füge eine PUT-Route hinzu, die eine Aufgabe durch die vom Client gesendeten Daten ersetzt.

  1. Füge in routes/tasks.js PUT /api/tasks/:id hinzu. Der Body muss beide Felder enthalten, zum Beispiel { "title": "Book the big room", "done": true }.
  2. Ersetze title und done der Aufgabe durch die Werte aus dem Body. Behalte id und createdAt der gespeicherten Aufgabe bei; übernimm sie niemals aus dem Body. Antworte mit Status 200 und der vollständigen Aufgabe:
    { "id": 2, "title": "Book the big room", "done": true, "createdAt": "2026-03-03T10:30:00.000Z" }
  3. Wenn im Body title oder done fehlt, antworte mit Status 400 und { "error": "PUT needs every field: title and done" } und ändere nichts. Ein Feld fehlt nur, wenn es überhaupt nicht im Body enthalten ist: "done": false ist ein echter Wert.
  4. Wenn keine Aufgabe diese ID hat, antworte mit Status 404 und { "error": "Task not found" }, wie bei den anderen Routen.

Probiere es aus: PUT /api/tasks/2 mit { "title": "Book the big room", "done": true } gibt Status 200 und die obige Aufgabe zurück. Danach gibt PUT /api/tasks/2 mit nur { "done": true } Status 400 zurück, und GET /api/tasks/2 zeigt weiterhin "Book the big room" an. PUT /api/tasks/99 mit beiden Feldern gibt Status 404 zurück.

Probier es selbst

import { Router } from 'express';
import { nextId, tasks } from '../store.js';

const router = Router();

router.get('/', (req, res) => {
    res.json(tasks);
});

router.get('/:id', (req, res) => {
    const task = tasks.find((t) => t.id === Number(req.params.id));
    if (!task) {
        return res.status(404).json({ error: 'Task not found' });
    }
    res.json(task);
});

router.post('/', (req, res) => {
    const { title } = req.body ?? {};
    if (!title) {
        return res.status(400).json({ error: 'title is required' });
    }
    const task = { id: nextId(), title, done: false, createdAt: new Date().toISOString() };
    tasks.push(task);
    res.status(201).location(`/api/tasks/${task.id}`).json(task);
});

router.patch('/:id', (req, res) => {
    const task = tasks.find((t) => t.id === Number(req.params.id));
    if (!task) {
        return res.status(404).json({ error: 'Task not found' });
    }
    const { title, done } = req.body ?? {};
    if (title !== undefined) task.title = title;
    if (done !== undefined) task.done = done;
    res.json(task);
});

router.delete('/:id', (req, res) => {
    const index = tasks.findIndex((t) => t.id === Number(req.params.id));
    if (index === -1) {
        return res.status(404).json({ error: 'Task not found' });
    }
    tasks.splice(index, 1);
    res.status(204).end();
});

export default router;
quiz iconTeste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

Alle Lektionen in REST-APIs

Übe selbstständig: Express-Playground