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) {}豆知識: ルートハンドラは
appディレクトリ内でのみ利用可能です。API ルート (pages) とルートハンドラ (app) を一緒に使用する必要はありません。ルートハンドラですべてのユースケースを処理できるはずです。
パラメータ
request (オプション)
request オブジェクトは NextRequest オブジェクトで、Web の Request API を拡張したものです。NextRequest を使用すると、cookies への簡単なアクセスや、拡張されたパース済み URL オブジェクト nextUrl など、受信リクエストをさらに制御できます。
context (オプション)
export async function GET(request, context: { params }) {
const team = 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
ルートハンドラは、NextResponse オブジェクトを返すことで Web Response API を拡張できます。これにより、クッキーやヘッダーの設定、リダイレクト、リライトを簡単に行えます。API リファレンスを参照。
バージョン履歴
| バージョン | 変更点 |
|---|---|
v13.2.0 | ルートハンドラが導入されました。 |