MERN项目POST请求/api/auth/signup返回404错误求助

问题描述 #

构建现代房产交易市场MERN应用时，前端向/api/auth/signup发起POST请求，始终返回404 Not Found错误。控制台错误信息：

POST http://localhost:5173/api/auth/signup 404 (Not Found)

已尝试检查请求URL、确认网络请求正常、替换为完整地址http://localhost:3000/api/auth/signup，问题仍存在。

核心原因与解决方案 #

1. 后端路由注册顺序错误（关键问题） #

后端入口index.js中，app.listen()被放在了路由注册代码之前，导致服务器启动时路由还未挂载，所有请求都会返回404。

修改后的后端index.js代码：

import dotenv from "dotenv";
import express from "express";
import mongoose from "mongoose";
import authRouter from "./routes/auth.route.js";
import userRouter from "./routes/user.route.js";
dotenv.config();

mongoose.connect(process.env.MONGO)
  .then( () => {
    console.log("Connected to MongoDB!");
  })
  .catch((err) => {
    console.log(err);
  });

const app = express();
app.use(express.json());

// 先注册路由
app.use("/api/user", userRouter);
app.use("/api/auth", authRouter);

// 再启动服务器
app.listen(3000, () => {
  console.log("Server is running on port 3000");
});

app.use((err, req, res, next) => {
  const statusCode = err.statusCode || 500;
  const message = err.message || "Internal Server Error";
  return res.status(statusCode).json({
    success: false,
    statusCode,
    message,
  });
});

2. 确认Auth路由文件配置 #

检查auth.route.js是否正确注册了/signup的POST路由，确保代码如下：

import express from "express";
import { signup } from "../controllers/auth.controller.js";

const router = express.Router();

router.post("/signup", signup);

export default router;

3. 验证Vite代理与后端服务状态 #

• 确认后端服务确实运行在localhost:3000，控制台输出Server is running on port 3000
• 前端请求时，查看浏览器网络面板，确认请求是否被代理到localhost:3000（请求的实际地址应为http://localhost:3000/api/auth/signup）

4. 修复前端组件语法错误 #

注册组件的return部分存在无效的img标签代码：

<div><img><img</img>`</div>`

建议替换为正确的图片引用：

<div><img src={loginImg} alt="Login illustration" /></div>

内容的提问来源于stack exchange，提问作者Azra