Course outline · 0% complete

0/29 lessons0%

Course overview →

Middleware: The Pipeline

lesson 5-2 · ~13 min · 15/29

One idea runs all of Express

Middleware is a function that sees the request before your route handler does. Each middleware can inspect the request, change it, end the response early, or pass control onward by calling next():

app.use((req, res, next) => {
  console.log(req.method + " " + req.url);
  next(); // hand over to the next function in line
});

Requests flow through the middleware in registration order, forming a pipeline: maybe a logger, then a body parser (express.json()), then an auth check, and finally your handler. Each stage decides: pass it on, or stop the chain.

Almost everything in the Express ecosystem, logging, sessions, CORS (cross-origin rules, defined below), rate limiting, auth, is packaged as middleware. Understand the pipeline and you understand the framework.

loggernext()authnext() or stophandlerres.json(...)the request flows left to right, any stage may end it early
The middleware pipeline. Each stage receives the request and either calls next() or ends the response itself.

Code exercise · javascript

Run this 15-line middleware engine, the actual mechanism inside Express. next() advances an index through the middleware list, then hands off to the handler.

Quiz

A middleware neither calls next() nor sends a response. What does the client experience?

Code exercise · javascript

Your turn. Make auth a real gate: if req.token === "secret" print "auth: ok" and call next(), otherwise print "auth: blocked" and do NOT call next. The two runs at the bottom must produce 5 lines total.

One middleware you will meet in week one: CORS

Browsers enforce the same-origin policy: by default, JavaScript on one origin (the scheme + domain + port combination, like https://myapp.com or http://localhost:5173) may not read responses it fetches from a different origin. The rule exists because you are logged into many sites at once; without it, any malicious page you visit could silently call your bank's API using your cookies, the small values a site stores in your browser and the browser automatically re-sends with every request to that site (they are how “staying logged in” works, as unit 7 will show), and read the answer.

That same rule blocks the legitimate case: a frontend served from http://localhost:5173 calling your API on http://localhost:3000 is cross-origin (different port, so a different origin). CORS (Cross-Origin Resource Sharing) is the opt-in mechanism the server uses to relax the policy: it adds a response header such as Access-Control-Allow-Origin: http://localhost:5173, which tells the browser "pages from that origin may read my responses." In Express it is one line of middleware, app.use(cors({ origin: "http://localhost:5173" })) from the cors package, which is why it appeared in the middleware list above.

Note carefully where the enforcement lives: in the browser. Command-line tools and other servers ignore CORS entirely, so it is not an access-control mechanism for your API. Authentication protects data; CORS only governs what web pages are allowed to read.

Quiz

Your frontend dev server at http://localhost:5173 calls your API at http://localhost:3000, and the browser console shows a CORS error. Where does the fix go?