Next.js Middleware: Routing, Auth, and Edge Computing

Tue, 18 Jun 2024 00:00:00 +0900

Introduction

Next.js Middleware executes before every request, running at the Edge or serverless region. A single middleware.ts file at the project root intercepts incoming requests and can redirect, rewrite, manipulate headers, or perform authentication checks before the request reaches the matched route.

Middleware is ideal for fast, edge-based decisions that should happen before page rendering. It does not run on static assets or _next/static by default.

Basic Structure

The middleware file exports a function that receives NextRequest and returns NextResponse, along with a config object that defines which paths trigger execution.

Middleware on Commentary of Takao

Next.js Middleware: Routing, Auth, and Edge Computing

Introduction

Basic Structure