"미들웨어"는 요청이 완료되기 전에 코드를 실행할 수 있게 해줍니다. 그런 다음 들어오는 요청을 기반으로 응답을 수정할 수 있으며, 이는 리다이렉팅, 요청 또는 응답 헤더 수정 또는 직접 응답하는 등의 작업을 포함할 수 있습니다.

미들웨어는 캐시된 콘텐츠 및 경로가 일치하기 전에 실행됩니다. 자세한 내용은 경로 일치 참조를 참고하십시오.

Convention

프로젝트 루트 디렉토리에 있는 middleware.ts (또는 .js) 파일을 사용하여 미들웨어를 정의하세요. 예를 들어, 페이지 또는 앱과 동일한 수준에 위치하거나 적용 가능한 경우 src 내부에 위치시킬 수 있습니다.

Example

import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
 
// This function can be marked `async` if using `await` inside
export function middleware(request: NextRequest) {
  return NextResponse.redirect(new URL('/home', request.url))
}
 
// See "Matching Paths" below to learn more
export const config = {
  matcher: '/about/:path*',
}

[코드]middleware.ts

Matching Paths

미들웨어는 프로젝트의 모든 경로에 대해 호출됩니다. 실행 순서는 다음과 같습니다:

1. next.config.js에서의 헤더
2. next.config.js에서의 리디렉션
3. 미들웨어 (리라이트, 리디렉션 등)
4. next.config.js에서의 beforeFiles (리라이트)
5. 파일 시스템 라우트 (public/, _next/static/, pages/, app/ 등)
6. next.config.js에서의 afterFiles (리라이트)