👋

Next.JS AppRouterのAPIで204を返すには

2024/05/06に公開

TL;DR

new Response を使って返そう

Details

Next.jsのAppRouterを用いる中で、APIの実装を行う場合があると思います。
その際にリソースの削除を行ったもののページのリダイレクトが必要ない場合、Status Code 204を送りたい場合があるんではないでしょうか。

204 No Content - HTTP | MDN

Next.jsのAppRouterでは route.tsを用いてAPIの記述をしますが、Next.jsにおいて NextResponseで204を返すとエラーになります。
それは本来Bodyを返さないStatus Codeである204304をNextResponseで返してしまうとBodyがあると判断されるためエラーになってしまうというものです

Invalid API Route Status/Body Response

ただこのページの記法はroute.tsの記法に合致していないため、このように記載することでエラーを回避できます。

request.ts
export async function DELETE(req: NextRequest) {
    return new Response(null, {
        status: 204,
    });
}

以上、備忘録でした

Discussion