API route not found in .next directory
Answered
readme posted this in #help-forum
readmeOP
In my Next.js application one of my api routes is not found in the .next directory after executing the command
npm run build. As you can see the given images the /api/receipts/update/[id] route is not found the .next folder due to which i am having issues fetching this api route. Any suggestions??
Answered by readme
nvm i found the error
i named the
i named the
route..js instead of route.js. Thank you for you help @gin48 Replies
does it work on dev?
readmeOP
i have not deployed this application yet. This does not work on my local environment. I tried deleting the
.next folder as well but upon rebuilding it i get the same problem.readmeOP
Nope it does not
what errors do u get
readmeOP
I get a 405 method not found error
I’ll show you the screenshots
screenshot route.js
but thats a completely different route tho
u was talking about /api/receipts/update/[id]
readmeOP
I’ll send route.js
Yes I changed the directory name from edit to update
But it’s the same route
whats inside [id] folder
readmeOP
after the middleware i directly have my route.js
import { db } from "@/config/firebase";
import { getReceipt } from "@/helpers/getReceipt";
import { NextResponse } from "next/server";
export const PUT = async (req, { params }) => {
try {
console.log(req)
const data = await req.json();
const receiptId = params.id;
const receiptRef = db.collection("receipts").doc(receiptId);
await receiptRef.update(data);
const updatedReceipt = await getReceipt(receiptId)
return NextResponse.json(
{
message: "Receipt updated successfully",
receipt: updatedReceipt,
},
{ status: 200 }
);
} catch (error) {
console.log(error);
return NextResponse.json(
{
error: "Error updating image",
},
{ status: 400 }
);
}
};
if there is a route.js screenshot the code
readmeOP
Ok hold on
Let me start my pc
what route is this?
try
export async function PUT(
request: Request,
{ params }: { params: Promise<{ id: string }> }
) {
const slug = (await params).id // 'a', 'b', or 'c'
}readmeOP
/api/receipts/update/[id]
remove the typescript part
readmeOP
Ok
export async function PUT(request, { params }) {
const slug = (await params).id // 'a', 'b', or 'c'
}readmeOP
i could do it but the issue is that i redirects to the /api/auth/login page anyways so im not gonna enter this route
this is the error log
why does that redirect happen?
do u have something in middleware?
readmeOP
the redirect happens because kinde auth thinks that the token that i am providing is not valid hence i get the getUser error. But all my other routes are made in the exact same fashion and have not errors whatsoever. The token and headers are all being logged correctly in the middleware so that's not an issue
maybe the PUT request is not accepted by your auth
readmeOP
The issue is that since the .next folder does not recognize the /api/receipts/update/[id] the request does not hit that route.
I've tried POST as well i get the same result.
hmm
readmeOP
so that's how i knew that i'ts a next js issue not a kinde auth issue
so i'm trying to find a way to get the /api/receipts/update/[id] folder in the .next folder
readmeOP
nvm i found the error
i named the
i named the
route..js instead of route.js. Thank you for you help @ginAnswer
readmeOP
it works now
no proble
glad it works