🎉 공식문서 번역에 참여해주세요.  🐙  Github 바로가기  🐙
Docs
App Router
API Reference
File Conventions
Route

route.js

Route Handlers는 Web Request (opens in a new tab) 및 Response (opens in a new tab) API를 사용하여 특정 라우트에 대한 커스텀 요청 핸들러를 생성할 수 있게 해줍니다.

HTTP Methods

route 파일은 특정 라우트에 대한 커스텀 요청 핸들러를 생성할 수 있게 해줍니다. 다음 HTTP 메서드 (opens in a new tab)를 지원합니다: GET, POST, PUT, PATCH, DELETE, HEAD, OPTIONS.

route.ts
export async function GET(request: Request) {}
 
export async function HEAD(request: Request) {}
 
export async function POST(request: Request) {}
 
export async function PUT(request: Request) {}
 
export async function DELETE(request: Request) {}
 
export async function PATCH(request: Request) {}
 
// If `OPTIONS` is not defined, Next.js will automatically implement `OPTIONS` and  set the appropriate Response `Allow` header depending on the other methods defined in the route handler.
export async function OPTIONS(request: Request) {}
route.js
export async function GET(request) {}
 
export async function HEAD(request) {}
 
export async function POST(request) {}
 
export async function PUT(request) {}
 
export async function DELETE(request) {}
 
export async function PATCH(request) {}
 
// If `OPTIONS` is not defined, Next.js will automatically implement `OPTIONS` and  set the appropriate Response `Allow` header depending on the other methods defined in the route handler.
export async function OPTIONS(request) {}

알아두면 좋은 점: Route Handlers는 App Router 내에서만 사용할 수 있습니다. API Routes(pages)와 Route Handlers(app)를 함께 사용할 필요가 없으며, Route Handlers는 모든 사용 사례를 처리할 수 있습니다.

Parameters

request (optional)

request 객체는 Web Request (opens in a new tab) API의 확장인 NextRequest 객체입니다. NextRequest는 cookies 및 확장된 URL 객체 nextUrl에 쉽게 접근하는 등 들어오는 요청에 대한 추가 제어를 제공합니다.

context (optional)

app/dashboard/[team]/route.ts
type Params = {
  team: string
}
 
export async function GET(request: Request, context: { params: Params }) {
  const team = context.params.team // '1'
}
 
// Define params type according to your route parameters (see table below)
app/dashboard/[team]/route.js
export async function GET(request, context) {
  const team = context.params.team // '1'
}

현재 context의 유일한 값은 params이며, 이는 현재 라우트의 동적 라우트 매개변수를 포함하는 객체입니다.

ExampleURLparams
app/dashboard/[team]/route.js/dashboard/1{ team: '1' }
app/shop/[tag]/[item]/route.js/shop/1/2{ tag: '1', item: '2' }
app/blog/[...slug]/route.js/blog/1/2{ slug: ['1', '2'] }

NextResponse

Route Handlers는 NextResponse 객체를 반환하여 Web Response API를 확장할 수 있습니다. 이를 통해 쿠키 설정, 헤더 설정, 리디렉션 및 경로 재작성 등을 쉽게 할 수 있습니다. API 참조 보기.

Version History

VersionChanges
v15.0.0The default caching for GET handlers was changed from static to dynamic
v13.2.0Route Handlers are introduced.
Route Segment ConfigTemplate