Projekt mit Express anlegen
Initialisieren – package.json im Projektordner mit npm init anlegen.
npm init -y
Das erzeugt die Datei package.json im Node-Ordner. Server in index.js (default) oder server.js (in package.json einsetzen) erzeugen
Express installieren
npm install express
Bislang wurde meist nodemon installiert, um den Server nicht nach jeder Änderungen neu starten zu müssen.
npm install nodemon --save-dev
Stattdessen kann heute watch eingesetzt – nur eine Änderung an den npm-Scripts in der Datei package.json:
"scripts": {
"start": "node server",
"dev": "node --watch server"
},
Mit npm run dev in der Konsole startet der Server und erkennt Änderungen beim Speichern automatisch.
Einfache Routes, HTML und JSON ohne stringify
Kein Content-Type muss angegeben werden, HTML wird geparst, selbst JSON-Daten können versendet werden, und zwar ohne stringify.
const express = require("express");
const app = express();
// Ganz einfache Weiterleitung mit Endpunkt /
app.get("/", (req, res) => {
res.send("<h1>Hallo Welt</h1>");
})
app.listen(3000, () => console.log("Server running on port 3000"));
localhost:5000 im Browser eingeben, und schon steht eine HTML-Seite mit Lametta.
<html> <head> </head> <body> <h1>Hallo Welt</h1> </body> </html>
Anstelle von <h1>Hallo Welt</h1> könnte auch direkt ein JSON-Objekt stehen.
res.send({ autor: "Douglas Adams"});
Am Rande: Traditionell werden Module mit require geladen, seit ES6 (ab Node v15 – 2020) auch mit der import()-Funktion. import() gibt ein Promise zurück.
Routes – Weiterleitungen
Eine Route oder Weiterleitung bestimmt, wie eine Anwendung auf einen Client-Request an einem bestimmten Endpunkt antwortet – Route Handler sind Code-Blöcke, die die Logik der Query Strings abhandeln.
Route parameters – Weiterleitungs-Parameter – sind URL-Segmente mit Namen, die auf eine spezielle Position der URL abzielen.
Route path: /users/:userId/books/:bookId
Request URL: http://localhost:3000/users/34/books/8989
req.params: { "userId": "34", "bookId": "8989" }
app.get('/users/:userId/books/:bookId', (req, res) => {
res.send(req.params)
})
Quelle: Express
Mit einem einfachen Callback
// GET mit Routing-Parametern
app.get("/class/:id", (request, response) => {
//console.log (request.params);
const studentId = Number(request.params.id);
const student = data.filter((student) => student.id === studentId);
response.send(student);
});
Aufrufen mit
http://localhost:3000/class/26
Express Static Middleware
Statt jetzt für jeden Endpunkt der Anwendung ein app.get / app.post einzusetzen, wird Express Static Middleware eingesetzt. Middleware sitzt zwischen hereinkommenden und ausgehenden Requests und Responses. Noch das Node-Modul path importieren und einen Ordner für HTML-Dateien – z.B. public – im Node-Ordner anlegen.
const express = require("express");
const path = require("path");
const app = express();
// express static folder
app.use(express.static(path.join(__dirname, "public")));
app.listen(7000, () => console.log("Server running on port 7000"));
Jede HTML-Datei, die im Ordner public angelegt wird, ist jetzt im Browser mit ihrer Route erreichbar. HTML-Dateien müssen jetzt allerdings mit .html-Erweiterung aufgerufen werden.
express app.get mit next()
Die next-Funktion muss nicht next heißen.
// GET mit next()
app.get ("/next", (request, response, next) => {
console.log ("Response will be send by the next function");
next();
}, (request, response ) => {
response.send("Just set up route with second callback")
});
Response Methoden
- .json
- Sendet eine JSON-Respons
- .send
- Sendet eine HTTP-Respons
- .download()
- Überträgt eine Datei als Anhang
- .redirect()
- Weiterleitung an einen bestimmten Pfad
import data from "./data/mock.json" assert { type: 'json' };
…
app.get ("/", (request, response) => {
response.json(data);
});
// GET mit download
app.get ("/download", (request, response) => {
response.download ("images/gaspreis-entwicklung-2005-2020.webp");
});
Middleware
Entsprechend der offiziellen Express-Dokumentation versteht man unter Middleware-Funktionen solche Funktionen, die Zugriff auf auf das Request-Object, das Response-Object und die next-Funktion haben.
Wenn ein Request hereinkommt, fließt der Request sequentiell durch alle Middelware-Funktionen, bis eine Response zustande kommt und kehrt dann zurück zum Client.
Middleware-Funktionen werden mit app.use registriert.
app.use (function (req, res, next) {
})
Der dritte Parameter next ist ein callback, ist die Flusssteuerung und kann zusätzliche Aufgaben durchführen.
