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 missingEin 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 };Aufgabe
EinfachEin 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.
- Füge in
routes/tasks.jsPUT /api/tasks/:idhinzu. Der Body muss beide Felder enthalten, zum Beispiel{ "title": "Book the big room", "done": true }. - Ersetze
titleunddoneder Aufgabe durch die Werte aus dem Body. BehalteidundcreatedAtder 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" } - Wenn im Body
titleoderdonefehlt, 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": falseist ein echter Wert. - 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;
Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in REST-APIs
1Ressourcen und Verben
Ressourcen und URLsErstellen mit POST4Browser, Versionen und Konfiguration
Was ist ein Origin?Einen anderen Origin zulassenCORSEine Seite, die die API aufruftÜbe selbstständig: Express-Playground