HTTP 405 "Method Not Allowed"
Unanswered
European pilchard posted this in #help-forum
European pilchardOP
Hi everyone, I apologize in advance as this must be a redundant issue. I'm using Next.js with deployment on Vercel in combination with Prisma and Supabase. Everything works fine locally, but once deployed, I have an issue with the requests to the APIs.
My API files are located in pages/api, and the routing is working correctly as it's possible to access the file. However, no matter what I do, I keep getting this infamous error.
405 POST Method not allowed
Error: SyntaxError: Unexpected end of JSON input
Here is the server-side code.
// pages/api/updateNode.ts
import type { NextApiRequest, NextApiResponse } from 'next';
import prisma from...
const handler = async (req: NextApiRequest, res: NextApiResponse) => {
if (req.method === 'POST') {
const {
id,
positionX,
positionY,
} = req.body;
try {
const updateNode = await prisma.node.update({
where: { id: id },
data: {
positionX,
positionY,
},
});
if(updateNode) {
res.status(200).json(updateNode);
} else {
res.status(404).json({ message: 'No node found to update' });
}
} catch (error) {
res.status(500).json({ message: 'Erreur lors de la mise à jour de la position', error });
}
} else {
res.status(405).json({ message: 'Méthode non autorisée' });
}
}
export default handler;
And the client side :
fetch(apiAdress + 'updateNode', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
id: d.data.id,
positionX: d.data.positionX,
positionY: d.data.positionY,
})
})
.then(response => response.json())
.catch((error) => {
console.error('Error:', error);
});
}
Thank you for helping me, I can't take it anymore. I have really tried many things in vain.
My API files are located in pages/api, and the routing is working correctly as it's possible to access the file. However, no matter what I do, I keep getting this infamous error.
405 POST Method not allowed
Error: SyntaxError: Unexpected end of JSON input
Here is the server-side code.
// pages/api/updateNode.ts
import type { NextApiRequest, NextApiResponse } from 'next';
import prisma from...
const handler = async (req: NextApiRequest, res: NextApiResponse) => {
if (req.method === 'POST') {
const {
id,
positionX,
positionY,
} = req.body;
try {
const updateNode = await prisma.node.update({
where: { id: id },
data: {
positionX,
positionY,
},
});
if(updateNode) {
res.status(200).json(updateNode);
} else {
res.status(404).json({ message: 'No node found to update' });
}
} catch (error) {
res.status(500).json({ message: 'Erreur lors de la mise à jour de la position', error });
}
} else {
res.status(405).json({ message: 'Méthode non autorisée' });
}
}
export default handler;
And the client side :
fetch(apiAdress + 'updateNode', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
id: d.data.id,
positionX: d.data.positionX,
positionY: d.data.positionY,
})
})
.then(response => response.json())
.catch((error) => {
console.error('Error:', error);
});
}
Thank you for helping me, I can't take it anymore. I have really tried many things in vain.
6 Replies
European pilchardOP
And of course, here's what apiAdress corresponds to:
const URL = process.env.NEXT_PUBLIC_API_BASE_URL;
const apiAdress = ${URL}/api/;
Well, the NEXT_PUBLIC_API_BASE_URL corresponds to the server deployment address of Vercel, and the environment variable is also set up on the server in addition to the env file.
const URL = process.env.NEXT_PUBLIC_API_BASE_URL;
const apiAdress = ${URL}/api/;
Well, the NEXT_PUBLIC_API_BASE_URL corresponds to the server deployment address of Vercel, and the environment variable is also set up on the server in addition to the env file.
European pilchardOP
up 😦
Singapura
Getting the same issue :/ Anyone have any ideas?
In my case I'm not getting any additional infromation, simply a 405 error with "Unexpected error" in the logs.
European pilchardOP
Seems like we will not have an answer here