route.js

路由处理程序允许你使用 Web 请求 和 响应 API 为给定路由创建自定义请求处理程序。

¥Route Handlers allow you to create custom request handlers for a given route using the Web Request and Response APIs.

export async function GET() {
  return Response.json({ message: 'Hello World' })
}

export async function GET() {
  return Response.json({ message: 'Hello World' })
}

参考

¥Reference

HTTP 方法

¥HTTP Methods

路由文件允许你为给定路由创建自定义请求处理程序。支持以下 HTTP 方法：GET、POST、PUT、PATCH、DELETE、HEAD 和 OPTIONS。

¥A route file allows you to create custom request handlers for a given route. The following HTTP methods are supported: GET, POST, PUT, PATCH, DELETE, HEAD, and 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) {}

// 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) {}

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) {}

参数

¥Parameters

request（可选）

¥request (optional)

request 对象是 NextRequest 对象，它是 Web 请求 API 的扩展。NextRequest 使你可以进一步控制传入请求，包括轻松访问 cookies 和扩展的、已解析的 URL 对象 nextUrl。

¥The request object is a NextRequest object, which is an extension of the Web Request API. NextRequest gives you further control over the incoming request, including easily accessing cookies and an extended, parsed, URL object nextUrl.

import type { NextRequest } from 'next/server'

export async function GET(request: NextRequest) {
  const url = request.nextUrl
}

export async function GET(request) {
  const url = request.nextUrl
}

context（可选）

¥context (optional)

• params：一个 promise，解析为包含当前路由的 动态路由参数 的对象。

  ¥**params**: a promise that resolves to an object containing the dynamic route parameters for the current route.

export async function GET(
  request: Request,
  { params }: { params: Promise<{ team: string }> }
) {
  const team = (await params).team
}

export async function GET(request, { params }) {
  const team = (await params).team
}

示例	URL	params
app/dashboard/[team]/route.js	/dashboard/1	Promise<{ team: '1' }>
app/shop/[tag]/[item]/route.js	/shop/1/2	Promise<{ tag: '1', item: '2' }>
app/blog/[...slug]/route.js	/blog/1/2	Promise<{ slug: ['1', '2'] }>

示例

¥Examples

处理 cookie

¥Handling cookies

import { cookies } from 'next/headers'

export async function GET(request: NextRequest) {
  const cookieStore = await cookies()

  const a = cookieStore.get('a')
  const b = cookieStore.set('b', '1')
  const c = cookieStore.delete('c')
}

import { cookies } from 'next/headers'

export async function GET(request) {
  const cookieStore = await cookies()

  const a = cookieStore.get('a')
  const b = cookieStore.set('b', '1')
  const c = cookieStore.delete('c')
}

版本历史

¥Version History

版本	变化
v15.0.0-RC	context.params 现在是一个 promise。codemod 可用
v15.0.0-RC	GET 处理程序的默认缓存已从静态更改为动态
v13.2.0	引入路由处理程序。