Build and Understand Express Middleware through Examples

Als je de afgelopen zeven of acht jaar veel aan Node hebt ontwikkeld, heb je Express waarschijnlijk wel eens gebruikt om een webserver te bouwen. Hoewel je een server in Node kunt maken zonder gebruik te maken van een library, geeft het je niet veel uit de doos en kan het behoorlijk omslachtig zijn om functionaliteit toe te voegen. Express is een minimalistische, “unopinionated” server library en is de de facto standaard geworden voor het bouwen van web apps in Node. Om Express te begrijpen, moet je Express Middleware begrijpen.

Wat is Express Middleware?

Middleware betekent letterlijk alles wat je tussen de ene en de andere laag van de software plaatst. Express middleware zijn functies die worden uitgevoerd tijdens de levenscyclus van een verzoek aan de Express server. Elke middleware heeft toegang tot de HTTP request en response voor elke route (of pad) waaraan het is gekoppeld. In feite is Express zelf volledig gecompromitteerd uit middleware functies. Bovendien kan middleware het HTTP verzoek beëindigen of doorgeven aan een andere middleware functie door gebruik te maken van next (meer daarover binnenkort). Deze “chaining” van middleware stelt u in staat om uw code te compartimenteren en herbruikbare middleware te maken.

In dit artikel leg ik uit wat middleware is, waarom u het zou gebruiken, hoe u bestaande Express middleware kunt gebruiken, en hoe u uw eigen middleware voor Express kunt schrijven.

Eisen om Express Middleware te schrijven

Er zijn een paar dingen die u geïnstalleerd moet hebben om Express middleware te maken, te gebruiken en te testen. Ten eerste, heb je Node en NPM nodig. Om er zeker van te zijn dat u deze hebt geïnstalleerd, kunt u het volgende uitvoeren:

npm -v && node -v

U zou de Node- en NPM-versies moeten zien die u hebt geïnstalleerd. Als u een foutmelding krijgt, moet u Node installeren. Ik gebruik de laatste versie van beide op het moment van dit artikel, dat is Node 10.9.0 en NPM 6.4.1, maar alle voorbeelden zouden moeten werken met Node versies 8+ en NPM versies 5+.

Ik gebruik ook Express versie 4.x. Dit is belangrijk omdat er grote veranderingen zijn doorgevoerd van versie 3.x naar 4.x.

Het zal ook nuttig zijn om Postman geïnstalleerd te hebben om routes te testen die andere HTTP werkwoorden gebruiken dan GET.

Express Middleware: De basis

Om te beginnen, zult u de meest eenvoudige van Express’s ingebouwde middleware gebruiken. Dit geeft je de kans om te zien hoe middleware wordt gebruikt, en hoe Express middleware is gestructureerd.

Maak een nieuw project aan en npm init het…

npm initnpm install express --save

Maak server.js en plak de volgende code:

const express = require('express');const app = express();app.get('/', (req, res, next) => { res.send('Welcome Home');});app.listen(3000);

Run de server via node server.js, open http://localhost:3000, en u zou “Welcome Home” in uw browser moeten zien afgedrukt.

De app.get() functie is Middleware op applicatieniveau. U zult zien dat de parameters die aan de methode worden doorgegeven reqres, en next zijn. Dit zijn het inkomende verzoek, het antwoord dat wordt geschreven, en een methode die moet worden aangeroepen om het verzoek door te geven aan de volgende middleware functie zodra de huidige middleware klaar is. In dit geval, zodra het antwoord is verzonden, verlaat de functie. Je zou hier ook andere middleware kunnen ketenen door de next() methode aan te roepen.

Laten we eens kijken naar nog een paar voorbeelden van de verschillende soorten middleware.

Express Request Logging Middleware Voorbeeld

In Express kun je middleware instellen als “globale” middleware; dat wil zeggen dat deze wordt aangeroepen voor elk inkomend verzoek.

Verander de inhoud van server.js in:

const express = require('express');const app = express();app.use((req, res, next) => { console.log(req); next();});app.get('/', (req, res, next) => { res.send('Welcome Home');});app.listen(3000);

const express = require('express');const app = express();const requireJsonContent = () => { return (req, res, next) => { if (req.headers !== 'application/json') { res.status(400).send('Server requires application/json') } else { next() } }}app.get('/', (req, res, next) => { res.send('Welcome Home');});app.post('/', requireJsonContent(), (req, res, next) => { res.send('You sent JSON');})app.listen(3000);

node server.js

npm install @okta/[email protected] --save

const oidc = new ExpressOIDC({ issuer: 'https://{yourOktaDomain}/oauth2/default', client_id: '{yourClientId}', client_secret: '{yourClientSecret}', redirect_uri: 'http://localhost:3000/authorization-code/callback', scope: 'openid profile'});

app.use(oidc.router);

app.get('/protected', oidc.ensureAuthenticated(), (req, res) => { res.send('Top Secret');});

app.use((err, req, res, next) => { // middleware functionality here})

app.get('/my-other-thing', (req, res, next) => { next(new Error('I am passing you an error!'));});app.use((err, req, res, next) => { console.log(err); if(!res.headersSent){ res.status(500).send(err.message); }});

app.get('/nonexistant', (req, res, next) => { let err = new Error('I couldn\'t find it.'); err.httpStatusCode = 404; next(err);});app.get('/problematic', (req, res, next) => { let err = new Error('I\'m sorry, you can\'t do that, Dave.'); err.httpStatusCode = 304; next(err);});// handles not found errorsapp.use((err, req, res, next) => { if (err.httpStatusCode === 404) { res.status(400).render('NotFound'); } next(err);});// handles unauthorized errorsapp.use((err, req, res, next) => { if(err.httpStatusCode === 304){ res.status(304).render('Unauthorized'); } next(err);})// catch allapp.use((err, req, res, next) => { console.log(err); if (!res.headersSent) { res.status(err.httpStatusCode || 500).render('UnknownError'); }});