I am struggling with Next.js 13's app
routing. It always gives me a 404 Not Found when I try to access, for example from Postmann.
I have this file structure:
And for example, one of my API files is:
import { PrismaClient } from '@prisma/client';
const prisma = new PrismaClient();
export default async function all(req, res) {
if (req.method !== 'GET') {
return res.status(405).json({ error: 'Method not allowed' });
}
try {
// Get all admins using Prisma
const admins = await prisma.admin.findMany();
return res.status(200).json(admins);
}
catch (error) {
return res.status(500).json({ error: 'Failed to get admins' });
}
}
When I send a GET localhost:3000/api/admin/all
it always responds with a 404. Couldn't find where is the error.
I tried other file or folder namings. Calling from my own app, using the curl command, or using Postman. My other API routes give the same 404.
An API Route should be in a file called route.js
. Meaning app/api/admin/all.js
should be app/api/admin/route.js
, with the corresponding URL being /api/admin
. Also, the functions inside should use a specific definition:
export async function GET(request) {}
GET
can be replaced with POST
, PUT
, PATCH
, etc. In your case, it would be:
// Notice from where NextResponse is imported:
import { NextResponse } from "next/server";
import { PrismaClient } from "@prisma/client";
const prisma = new PrismaClient();
// Notice the function definition:
export async function GET(req) {
return NextResponse.json(
{ error: "Method not allowed" },
{
status: 405
}
);
}
// Notice the function definition:
export async function POST(req) {
try {
// Get all admins using Prisma
const admins = await prisma.admin.findMany();
return NextResponse.json(admins, {
status: 200,
});
} catch (error) {
return NextResponse.json(
{ error: "Failed to get admins" },
{
status: 500,
}
);
}
}