Nuxt 3 Failed to load resource: the server responded with a status of 404

Hi all, can someone please help me make sense of this sudden error?

Failed to load resource: the server responded with a status of 404 ()

All of a sudden, all api calls are returning a 404 error in production (Netlify), but when run locally, everything works as expected.

While debugging this issue, I cleared the cache and forced a redeploy of the app and my staging app is finally working again, but not the main one. Both sites are identical clones. The runs from my Github dev repo, while runs from the main repo.

Here’s a code snippet for example:

// server/api/
export default defineEventHandler(async (event) => {	

	if (event.node.req.method !== "POST") return { error: "Method not allowed" };
	const payload = (await readBody(event)) as client.MailDataRequired;	

	try {
		const response = await client.send(payload);
    consola.success("πŸš€ Message sent");
		return response[0].statusCode;
	} catch (error) {
    // ...
		consola.error("Send failed", error);

I’m calling this from the frontend like this:

async function submit() {
  const msg = {
    to: "",
    from: "",
    subject: "You have a message",
    template_id: "xxx",
    dynamic_template_data: {      
      message: `${form.firstname} would like to connect with you.`,

  try {    
    await useFetch("/api/send", {
      method: "POST",
      body: msg

  } catch (e) {
    console.log("send failed", e)

I should note that this issue happened out the blue about a week ago, though no breaking changes were made to the codebase. Just an environment variable was updated.

Thanks in advance.

After a few hours of debugging – the issues is fixed by removing an environment key that was present in the live site settings and on the team settings.

Hi @treigh :wave:t6:,

Welcome to the forums! I appreciate the feedback. This will help other users who are experiencing similar issues.

1 Like