Apa Itu Express Middleware? Cara Kerja next() dan Contohnya

Middleware di Express adalah fungsi dengan signature (req, res, next) yang berjalan di antara saat request tiba dan saat response dikirim. Setiap middleware bisa membaca atau mengubah req dan res, mengakhiri request dengan mengirim response, atau memanggil next() untuk menyerahkan request ke fungsi berikutnya dalam antrean. app.use(fn) menambahkan middleware untuk setiap request, dan Express menjalankan semuanya sesuai urutan pendaftarannya.

const express = require('express');
const app = express();

function logger(req, res, next) {
    req.startedAt = Date.now();
    console.log('1. logger:', req.method, req.url);
    next();
}

app.use(logger);

app.use((req, res, next) => {
    console.log('2. second middleware');
    next();
});

app.get('/', (req, res) => {
    console.log('3. route handler');
    res.json({ ok: true, tookMs: Date.now() - req.startedAt });
});

app.listen(3000);

Console mencatat ketiga langkah secara berurutan untuk setiap request, dan route membaca req.startedAt, property yang ditambahkan oleh logger. Kirim GET /missing: kedua middleware tetap mencatat, karena app.use() cocok dengan setiap path, lalu Express menjawab 404 karena tidak ada route yang cocok.

Lupa next()

Middleware yang tidak mengirim response dan tidak memanggil next() membuat request menggantung. Client menunggu sampai timeout, dan tidak ada yang muncul di log, sehingga ini menjadi bug middleware yang umum. Hapus next(); dari logger di atas lalu kirim GET / lagi: request-nya tidak pernah mendapat jawaban.

Aturannya sederhana: setiap jalur di dalam middleware berakhir dengan tepat satu dari ini:

• next() untuk lanjut,
• next(err) untuk melompat ke error handler (lihat penanganan error Express),
• response seperti res.json() atau res.status(401).send().

Memanggil next() setelah mengirim response juga bug. Handler berikutnya mencoba mengirim response kedua dan Express melempar ERR_HTTP_HEADERS_SENT. Tulis return res.status(401).json(...) supaya fungsinya berhenti di situ.

Cek auth yang menghentikan request

Middleware yang menolak request mengirim response-nya sendiri dan tidak pernah memanggil next(). Berikan sebagai argumen tambahan ke sebuah route untuk melindungi route itu saja:

const express = require('express');
const app = express();

function requireApiKey(req, res, next) {
    if (req.get('x-api-key') !== 'secret123') {
        return res.status(401).json({ error: 'Missing or wrong API key' });
    }
    req.client = 'reporting-app';
    next();
}

app.get('/public', (req, res) => {
    res.json({ message: 'Anyone can read this' });
});

app.get('/admin/stats', requireApiKey, (req, res) => {
    res.json({ users: 42, caller: req.client });
});

// GET /admin/stats
app.listen(3000);

Request pertama mendapat 401 dengan {"error":"Missing or wrong API key"}. Tambahkan header x-api-key: secret123 di request bar lalu kirim lagi: sekarang jawabannya {"users":42,"caller":"reporting-app"}. /public tidak pernah menjalankan pengecekan itu.

Di mana middleware berjalan

Urutan adalah bagian dari maknanya. Logger yang didaftarkan setelah route tidak pernah mencatat request yang dijawab route-route itu, karena route yang mengirim response tidak memanggil next(). Daftarkan dulu middleware untuk seluruh aplikasi seperti logging, parsing body, dan CORS, lalu route-nya, lalu handler 404 dan error.

Middleware bawaan

Express menyertakan beberapa fungsi middleware yang kamu tambahkan dengan app.use(). Parser body mengisi req.body; tanpanya nilainya undefined.

const express = require('express');
const app = express();

app.use(express.json());
app.use(express.urlencoded());

app.get('/', (req, res) => {
    res.send('Send POST /echo with a body');
});

app.post('/echo', (req, res) => {
    res.json({ type: req.get('content-type'), body: req.body });
});

app.listen(3000);

Kirim POST /echo dengan body {"name": "Ada"} dan jawabannya menyertakan "body":{"name":"Ada"}. Hapus baris express.json(), kirim lagi, dan body hilang dari jawaban: req.body bernilai undefined, dan JSON.stringify membuang nilai undefined. Package seperti cors, helmet, dan morgan juga middleware: kamu npm install lalu memberikannya ke app.use() dengan cara yang sama. Halaman express.static membahas cara menyajikan file.

Kesalahan umum

Memanggil middleware alih-alih memberikannya. app.use(logger()) menjalankan logger sekali saat startup dan mendaftarkan nilai kembaliannya. Tulis app.use(logger). (express.json() pakai tanda kurung karena ia mengembalikan fungsi middleware.)

Menambahkan parser body setelah route. Route-nya berjalan lebih dulu dan melihat req.body sebagai undefined.

Mengira app.use('/admin', fn) hanya cocok dengan satu path. Ia juga berjalan untuk /admin/users dan setiap path lain di bawah /admin, untuk setiap method. Untuk menjaga satu route saja, berikan middleware-nya ke app.get('/admin', fn, handler).