Backend Architecture | VoidX Academy

9. Middleware & The Request Pipeline

Middleware

Middleware & The Request Pipeline

When an HTTP request arrives at your Express or Flask server, it doesn't teleport directly to your route handler. It travels through a pipeline — an ordered sequence of functions, each of which can inspect the request, modify it, stop it, or pass it along to the next function in line. These intermediate functions are called Middleware.

Middleware is arguably the most powerful concept in backend architecture. Authentication, logging, rate limiting, data validation, CORS handling, compression, error handling — all of these are implemented as middleware.

Visualizing the Pipeline

Think of an HTTP request as a new employee arriving at a secure company building. Before they reach their office (the final route handler), they go through a series of checkpoints:

HTTP Request arrives
POST /dashboard

→

Logger Middleware
Log to console

→

Body Parser
Parse JSON body

→

Auth Middleware
Verify JWT token

→

Route Handler
Process & respond

At any checkpoint, if something is wrong — the token is invalid, the request is malformed — the middleware terminates the pipeline right there and sends back an error response. The route handler is never reached.

The Anatomy of a Middleware Function

In Express, every middleware function receives the same three arguments: req (the request object), res (the response object), and next (a function that passes control to the next middleware in the chain).

function myMiddleware(req, res, next) {
    console.log(`Request received: ${req.method} ${req.url}`);
    next();
}

app.use(myMiddleware);

⚠️ The Hanging Request — The #1 Middleware Bug:

If a middleware function neither calls next() NOR sends a response (like res.json() or res.send()), the HTTP connection stays open forever. The client's browser will spin and spin, waiting for a response that will never come, until eventually the connection times out (usually after 30–120 seconds). This is a very common bug in early backend code.

Building a Logger Middleware

Logging every incoming request is one of the most useful things you can do. In production, logs are your only window into what is happening inside a live server.

app.use((req, res, next) => {
    const start = Date.now();
    res.on('finish', () => {
        const duration = Date.now() - start;
        const statusColor = res.statusCode >= 400 ? '\x1b[31m' : '\x1b[32m';
        console.log(
            `${new Date().toISOString()} | ` +
            `${req.method.padEnd(7)} ${req.url.padEnd(30)} | ` +
            `${statusColor}${res.statusCode}\x1b[0m | ` +
            `${duration}ms`
        );
    });
    next();
});

This will produce clean, color-coded output in your terminal for every request:

Authentication Middleware

The most commonly implemented middleware is authentication. It intercepts every protected request, extracts the user's token from the Authorization header, verifies it, and either attaches the decoded user to req.user (passing the request through) or immediately rejects with a 401.

const requireAuth = (req, res, next) => {
    const authHeader = req.headers['authorization'];
    if (!authHeader || !authHeader.startsWith('Bearer ')) {
        return res.status(401).json({ error: 'No authorization token provided' });
    }
    const token = authHeader.split(' ')[1];
    if (token !== 'valid-secret-token') {
        return res.status(401).json({ error: 'Invalid or expired token' });
    }
    req.user = { id: 'usr_123', role: 'admin' };
    next();
};

app.use('/admin', requireAuth);
app.get('/dashboard', requireAuth, (req, res) => {
    res.json({ message: `Welcome, user ${req.user.id}!` });
});

Modifying the Request Object

One of middleware's most powerful capabilities is that it can attach new data to the request object, making that data available to every subsequent function in the pipeline. The req object effectively becomes a bucket passed down the assembly line, and anyone can drop things into it.

app.use((req, res, next) => {
    req.requestId = `req_${Date.now()}_${Math.random().toString(36).slice(2, 7)}`;
    next();
});

app.use((req, res, next) => {
    req.user = { id: 1, name: 'Ama', role: 'admin' };
    next();
});

app.use((req, res, next) => {
    req.rateInfo = { requestsRemaining: 95, resetAt: Date.now() + 60000 };
    next();
});

app.get('/profile', (req, res) => {
    res.json({
        requestId: req.requestId,
        user: req.user,
        rateInfo: req.rateInfo
    });
});

Built-In & Third-Party Middleware You Will Use Every Day

📦express.json()

Parses incoming JSON request bodies and attaches the result to req.body. Essential for any API that receives data.

🌐cors

Handles Cross-Origin Resource Sharing headers. Prevents your API from being called by unauthorized frontend domains.

🔒helmet

Sets a dozen security-related HTTP response headers automatically. Protects against common attacks like clickjacking, XSS, etc.

⏱️express-rate-limit

Limits how many requests a single IP address can make in a time window. Prevents brute-force attacks and API abuse.

🗜️compression

Compresses HTTP response bodies with gzip before sending. Reduces bandwidth and speeds up API responses significantly.

📝morgan

A mature, production-ready HTTP request logger with multiple formatting options (tiny, dev, combined).

const express = require('express');
const cors    = require('cors');
const helmet  = require('helmet');
const morgan  = require('morgan');

const app = express();

app.use(helmet());
app.use(morgan('dev'));
app.use(cors({ origin: 'https://yourfrontend.com' }));
app.use(express.json({ limit: '10mb' }));

app.get('/hello', (req, res) => res.json({ message: 'Hello!' }));

Error-Handling Middleware

In Express, an error-handling middleware has a special signature: it takes four arguments — err, req, res, next. It must be the last middleware registered. Any call to next(error) anywhere in your routes will skip all remaining middleware and jump directly to this error handler.

app.get('/users/:id', async (req, res, next) => {
    try {
        const user = await db.findUser(req.params.id);
        if (!user) throw Object.assign(new Error('User not found'), { status: 404 });
        res.json(user);
    } catch (err) {
        next(err);
    }
});

app.use((err, req, res, next) => {
    const status  = err.status  || 500;
    const message = err.message || 'Internal Server Error';
    console.error(`[ERROR] ${req.method} ${req.url} — ${status}: ${message}`);
    res.status(status).json({
        error: message,
        ...(process.env.NODE_ENV === 'development' && { stack: err.stack })
    });
});

9. Middleware & The Request Pipeline

Middleware

Middleware & The Request Pipeline

Visualizing the Pipeline

Think of an HTTP request as a new employee arriving at a secure company building. Before they reach their office (the final route handler), they go through a series of checkpoints:

HTTP Request arrives
POST /dashboard

→

Logger Middleware
Log to console

→

Body Parser
Parse JSON body

→

Auth Middleware
Verify JWT token

→

Route Handler
Process & respond

The Anatomy of a Middleware Function

function myMiddleware(req, res, next) {
    console.log(`Request received: ${req.method} ${req.url}`);
    next();
}

app.use(myMiddleware);

⚠️ The Hanging Request — The #1 Middleware Bug:

Building a Logger Middleware

Logging every incoming request is one of the most useful things you can do. In production, logs are your only window into what is happening inside a live server.

app.use((req, res, next) => {
    const start = Date.now();
    res.on('finish', () => {
        const duration = Date.now() - start;
        const statusColor = res.statusCode >= 400 ? '\x1b[31m' : '\x1b[32m';
        console.log(
            `${new Date().toISOString()} | ` +
            `${req.method.padEnd(7)} ${req.url.padEnd(30)} | ` +
            `${statusColor}${res.statusCode}\x1b[0m | ` +
            `${duration}ms`
        );
    });
    next();
});

This will produce clean, color-coded output in your terminal for every request:

Authentication Middleware

const requireAuth = (req, res, next) => {
    const authHeader = req.headers['authorization'];
    if (!authHeader || !authHeader.startsWith('Bearer ')) {
        return res.status(401).json({ error: 'No authorization token provided' });
    }
    const token = authHeader.split(' ')[1];
    if (token !== 'valid-secret-token') {
        return res.status(401).json({ error: 'Invalid or expired token' });
    }
    req.user = { id: 'usr_123', role: 'admin' };
    next();
};

app.use('/admin', requireAuth);
app.get('/dashboard', requireAuth, (req, res) => {
    res.json({ message: `Welcome, user ${req.user.id}!` });
});

Modifying the Request Object

app.use((req, res, next) => {
    req.requestId = `req_${Date.now()}_${Math.random().toString(36).slice(2, 7)}`;
    next();
});

app.use((req, res, next) => {
    req.user = { id: 1, name: 'Ama', role: 'admin' };
    next();
});

app.use((req, res, next) => {
    req.rateInfo = { requestsRemaining: 95, resetAt: Date.now() + 60000 };
    next();
});

app.get('/profile', (req, res) => {
    res.json({
        requestId: req.requestId,
        user: req.user,
        rateInfo: req.rateInfo
    });
});

Built-In & Third-Party Middleware You Will Use Every Day

📦express.json()

Parses incoming JSON request bodies and attaches the result to req.body. Essential for any API that receives data.

🌐cors

Handles Cross-Origin Resource Sharing headers. Prevents your API from being called by unauthorized frontend domains.

🔒helmet

Sets a dozen security-related HTTP response headers automatically. Protects against common attacks like clickjacking, XSS, etc.

⏱️express-rate-limit

Limits how many requests a single IP address can make in a time window. Prevents brute-force attacks and API abuse.

🗜️compression

Compresses HTTP response bodies with gzip before sending. Reduces bandwidth and speeds up API responses significantly.

📝morgan

A mature, production-ready HTTP request logger with multiple formatting options (tiny, dev, combined).

const express = require('express');
const cors    = require('cors');
const helmet  = require('helmet');
const morgan  = require('morgan');

const app = express();

app.use(helmet());
app.use(morgan('dev'));
app.use(cors({ origin: 'https://yourfrontend.com' }));
app.use(express.json({ limit: '10mb' }));

app.get('/hello', (req, res) => res.json({ message: 'Hello!' }));

Error-Handling Middleware

app.get('/users/:id', async (req, res, next) => {
    try {
        const user = await db.findUser(req.params.id);
        if (!user) throw Object.assign(new Error('User not found'), { status: 404 });
        res.json(user);
    } catch (err) {
        next(err);
    }
});

app.use((err, req, res, next) => {
    const status  = err.status  || 500;
    const message = err.message || 'Internal Server Error';
    console.error(`[ERROR] ${req.method} ${req.url} — ${status}: ${message}`);
    res.status(status).json({
        error: message,
        ...(process.env.NODE_ENV === 'development' && { stack: err.stack })
    });
});

9. Middleware & The Request Pipeline

Middleware & The Request Pipeline

Visualizing the Pipeline

The Anatomy of a Middleware Function

Building a Logger Middleware

Authentication Middleware

Modifying the Request Object

Built-In & Third-Party Middleware You Will Use Every Day

Error-Handling Middleware

Knowledge Check

9. Middleware & The Request Pipeline

Middleware & The Request Pipeline

Visualizing the Pipeline

The Anatomy of a Middleware Function

Building a Logger Middleware

Authentication Middleware

Modifying the Request Object

Built-In & Third-Party Middleware You Will Use Every Day

Error-Handling Middleware

Knowledge Check