route.js
路由處理器 (Route Handlers) 允許您使用 Web Request 和 Response API 為指定路由建立自訂請求處理器。
HTTP 方法
route 檔案允許您為指定路由建立自訂請求處理器。支援以下 HTTP 方法：GET、POST、PUT、PATCH、DELETE、HEAD 和 OPTIONS。
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) {}
// 如果未定義 `OPTIONS`，Next.js 會自動實作 `OPTIONS` 並根據路由處理器中定義的其他方法設定適當的 Response `Allow` 標頭。
export async function OPTIONS(request: Request) {}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) {}
// 如果未定義 `OPTIONS`，Next.js 會自動實作 `OPTIONS` 並根據路由處理器中定義的其他方法設定適當的 Response `Allow` 標頭。
export async function OPTIONS(request) {}須知：路由處理器 (Route Handlers) 僅在
app目錄內可用。您不需要同時使用 API 路由 (pages) 和路由處理器 (app)，因為路由處理器應能處理所有使用情境。
參數
request (選用)
request 物件是一個 NextRequest 物件，它是 Web Request API 的擴充。NextRequest 讓您能進一步控制傳入的請求，包括輕鬆存取 cookies 和一個擴充的、已解析的 URL 物件 nextUrl。
context (選用)
type Params = {
team: string
}
export async function GET(request: Request, context: { params: Params }) {
const team = context.params.team // '1'
}
// 根據您的路由參數定義 params 類型（請參閱下方表格）
export async function GET(request, context: { params }) {
const team = context.params.team // '1'
}目前，context 的唯一值是 params，它是一個包含當前路由的動態路由參數的物件。
| 範例 | URL | params |
|---|---|---|
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。這讓您能輕鬆設定 cookies、標頭、重新導向和改寫。查看 API 參考文件。
版本歷史
| 版本 | 變更 |
|---|---|
v13.2.0 | 引入路由處理器 (Route Handlers)。 |