Query-Strings

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

Eine Listenseite benötigt oft Optionen, etwa dafür, welche Rezepte angezeigt werden sollen, und für jede Option eine neue Route anzulegen, wären zu viele.

app.get('/books', (req, res) => {
    const { author } = req.query;
    res.send(author ? 'Books by ' + author : 'All books');
});

Der Query-String ist der Teil der URL nach ?, und Express legt ihn in req.query ab, einem Objekt. const { author } = req.query ist die Kurzform von const author = req.query.author. GET /books?author=Austen ergibt req.query.author === 'Austen'. Ohne ? ist der Wert undefined. Mehrere Optionen werden mit & verbunden: /books?author=Austen&year=1813.

Ein Routenparameter ist Teil des Pfads und benennt eine einzelne Sache. Eine Abfrageoption filtert oder sortiert eine Liste und kann weggelassen werden.

Aufgabe

Einfach

Besucher möchten nur vegane Rezepte oder nur Abendessen sehen, ohne für jedes Tag eine neue Seite aufrufen zu müssen.

Ändere in server.js die Route /recipes. Lies die Option tag aus der Abfragezeichenfolge aus. Jedes Rezept in data.js hat eine Liste namens tags, zum Beispiel ['vegan', 'soup'].
Wenn ein Tag angegeben ist, sende nur die Titel der Rezepte, deren tags diesen Tag enthalten, jeweils einen Titel pro Zeile, wie es die Route jetzt schon tut.
Wenn kein Tag angegeben ist, sende wie bisher alle Titel.
Wenn kein Rezept den Tag hat, sende eine leere Antwort mit dem Status 200.

Probiere es aus: Drücke auf „Ausführen“ und rufe /recipes?tag=vegan auf. Du solltest zwei Zeilen sehen: Tomato Soup und Lentil Curry. Rufe /recipes?tag=dinner auf: Lentil Curry und Fish & Chips. Rufe /recipes?tag=dessert auf: eine leere Antwort, da kein Rezept diesen Tag hat. Rufe /recipes auf: alle vier Titel.

Probier es selbst

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

const app = express();

app.get('/', (req, res) => {
    res.send('Welcome to Recipe Box');
});

// type('text') sendet unformatierten Text, sodass jeder Titel in einer eigenen Zeile steht.
app.get('/recipes', (req, res) => {
    res.type('text').send(recipes.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('/about', (req, res) => {
    res.send('Recipe Box collects family recipes.');
});

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