React+Express注册接口404问题求助：多方案尝试未解决

以下是针对性的排查和解决步骤：

1. 代理配置修正 #

你的React项目package.json中代理配置为"proxy": "http://localhost:8800/api/"，存在路径拼接异常风险：

• 建议将代理地址修改为：

  "proxy": "http://localhost:8800"
  

• 同时客户端请求路径调整为：

  await axios.post("/api/auth/register", inputs);
  

如果是React v18+版本，更推荐使用setupProxy.js文件配置代理（避免package.json的代理限制），示例代码：

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(
    '/api',
    createProxyMiddleware({
      target: 'http://localhost:8800',
      changeOrigin: true,
    })
  );
};

2. 跳过代理直接测试 #

如果代理问题无法快速解决，直接在客户端使用完整服务端URL发起请求，验证路由是否存在：

await axios.post("http://localhost:8800/api/auth/register", inputs);

若仍返回404，说明问题出在服务端路由挂载环节。

3. 服务端路由挂载检查 #

• 确认index.js中authRoutes的导入路径正确：./routes/auth.js对应的文件是否存在于项目routes目录下？
• 启动服务端后，检查控制台是否打印Connected，确认服务端正常运行在8800端口；
• 在routes/auth.js中添加测试接口验证路由是否生效：

  router.get("/test", (req, res) => res.send("Auth route is working!"));
  

  访问http://localhost:8800/api/auth/test，若能返回内容则路由挂载正常，否则排查文件导入或路径错误。

4. 额外：修复密码哈希的异步逻辑（解决404后的必改问题） #

你的controllers/auth.js中使用bcrypt.hash异步版本时，直接将返回值赋值给pwd会导致pwd为undefined，数据库插入的密码无效，需修正为：

方案一：使用同步哈希 #

const hash = bcrypt.hashSync(req.body.password, 10);
const values = [req.body.username, req.body.email, hash];

方案二：正确处理异步回调 #

bcrypt.hash(req.body.password, 10, function(err, hash) {
  if (err) return res.status(500).json(err);
  const q = "INSERT INTO users(`username`,`email`,`password`) VALUES (?)";
  const values = [req.body.username, req.body.email, hash];
  db.query(q, [values], (err, data) => {
    if (err) return res.status(500).json(err);
    return res.status(200).json("User has been created.");
  });
});

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