🚀 Next.js: JSON 404 для несуществующих API-роутов

🚀 Next.js: JSON 404 для несуществующих API-роутов

В App Router есть нюанс: для несуществующих API-запросов возвращается HTML-страница из not-found.tsx. Но клиентам API нужен JSON, а не HTML 🙃

Решение — catch-all роут

Создаём роут, который перехватывает все неизвестные запросы:

/app/api/[...not_found]/route.ts

export async function GET() {

return Response.json({ error: 'Not Found' }, { status: 404 });

}

export async function POST() {

return Response.json({ error: 'Not Found' }, { status: 404 });

}

А для /api без вложений — отдельный route.ts:

export async function GET() {

return Response.json({ error: 'Not Found' }, { status: 404 });

}

В итоге:

/api/user → ваш рабочий endpoint

/api → { error: "Not Found" }

/api/anything/else → { error: "Not Found" }

Теперь API всегда отдаёт чистый JSON 404, а не HTML 👍

https://varnote.ru/frontend/nextjs-api-404-json/

varnote | #varnote #nextjs