Middleware & Authentication
Mempelajari cara mengamankan rute, menangani sesi, dan logika di sisi Edge menggunakan Middleware.
1. Edge Middleware
Middleware memungkinkan Anda menjalankan kode sebelum request selesai. Anda bisa melakukan redirect, rewrite, atau memodifikasi request/response headers.
Dijalankan di Edge Runtime
Middleware berjalan sangat dekat dengan user, sehingga sangat cepat untuk melakukan pengecekan sesi sebelum halaman dirender.
import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
export function middleware(request: NextRequest) {
const token = request.cookies.get('token')
if (!token && request.nextUrl.pathname.startsWith('/dashboard')) {
return NextResponse.redirect(new URL('/login', request.url))
}
return NextResponse.next()
}
export const config = {
matcher: '/dashboard/:path*',
}Interactive Demo: Middleware Simulator
Simulasi bagaimana Middleware mencegat request berdasarkan status login Anda.
User Controls
if (path === '/dashboard' && !isLoggedIn) {
return redirect('/login')
}Please login first.
2. Authentication Patterns
Di Next.js 15, pola yang disarankan adalah menyimpan sesi di cookie (HTTP-only) dan melakukan validasi di Server Components atau Middleware.
Client-side Auth
Gunakan `useSession` (dari library seperti NextAuth) untuk UI yang reaktif (misal: menu profil).
Server-side Auth
Cek sesi langsung di Server Component untuk keamanan maksimal dan mencegah "flicker" saat loading.
Hati-hati: Middleware Limits
Middleware berjalan di Edge Runtime yang terbatas. Anda tidak bisa menggunakan library Node.js berat (seperti file system access atau koneksi database langsung).