︙

route.js

Route Handlers を使用すると、Web Request および Response API を使用して、特定のルートに対するカスタムリクエストハンドラを作成することができます。

HTTP Methods

route ファイルを使用すると、特定の route に対してカスタム request ハンドラを作成できます。以下の HTTP methods がサポートされています: 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) {}

Good to know: Route ハンドラは、appディレクトリ内でのみ使用可能です。 API Routes (pages)と Route ハンドラ(app)を一緒に使用する必要はありません。なぜなら、 Route ハンドラはすべての使用ケースを処理できるはずだからです。

Parameters

`request`(オプション)

request object は、Webrequest API の拡張であるNextRequest object です。NextRequestを使用すると、cookiesへの容易なアクセスや拡張された解析された URLobject のnextUrlなど、来る request をより詳細に制御できます。

`context` (オプション)

app/dashboard/[team]/route.js

export async function GET(request, context: { params }) {
  const team = params.team // '1'
}

現在、contextの唯一の value は、現在の route に対するdynamic route parametersを含む object であるparamsです。

Example	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 ハンドラは、NextResponse object を返すことにより、Web の Response API を拡張できます。これにより、cookies、headers、redirect、および rewrite を簡単に設定できます。API reference を見る。

Version History

Version	Changes
`v13.2.0`	Route ハンドラーが導入されました。