使用Express/Node.js提交数据遇POST /api/shapes 404错误求助

我用Express.js和Node.js开发，想调用特定函数收集页面数据并存入数据库，但前端调用saveShapeData()时返回POST http://localhost:5000/api/shapes/ 404 (Not Found)错误，注册、登录功能用相同结构可正常运行，以下是相关代码：

前端Fetch函数 #

function saveShapeData() {
const shapesData = [];
$(".shape").each(function() {
  const shapeId = $(this).attr("id");
  const shapeData = {
    id: shapeId,
    imgElement: $(this).find("img").attr("src"), 
    items: $(this).data("info") ? $(this).data("info").items : [],
    css: $(this).attr("style")
  };
  shapesData.push(shapeData);
});
fetch("/api/shapes", {
    method: "POST",
    body: JSON.stringify(shapesData),
    headers: {
        "Content-Type": "application/json"
    }
})}

路由代码（GET请求） #

router.get("/shapes", loggedIn, (req, res) => {
if(req.user){
    console.log("saedfe " + req.user.shapes);
    res.sendFile("shapes.html", { root: "./public/" });
}
else{
    res.render("index", {status:"no", user: "nothing"});
}
})

控制器代码 #

const db = require('../routes/db-config.js');
const jwt = require('jsonwebtoken');

const shapes = async (req, res, next) => {
    const { shapesData } = req.body;
    if (!req.cookies.userRegistered) return next();
    try{
        const decoder = jwt.verify(req.cookies.userRegistered, process.env.JWT_SECRET);
        db.query('INSERT INTO users VALUES (?) WHERE id = ?', [shapesData, decoder.id], (err, result) => {
            if(err) return next();
            return next();
        })
    } catch (err){
        if(err) return next()
    }
}

module.exports = shapes;

auth.js路由配置 #

const express = require('express');
const register = require('./register')
const login = require('./login')
const shapes = require('./shapes')

const router = express.Router();

router.post("/register", register)
router.post("/login", login)
router.post("/shapes", shapes)

module.exports = router;

错误原因排查及解决方案 #

1. 路由挂载路径不匹配
   前端请求的是/api/shapes，需确认主应用（如app.js）是否将auth.js路由挂载到/api前缀下。如果没有配置以下代码，auth.js里的/shapes只会映射到/shapes，而非/api/shapes，直接导致404：

   const authRouter = require('./routes/auth');
   app.use('/api', authRouter);
   

2. 请求路径末尾斜杠问题
   错误提示显示请求路径是/api/shapes/（带末尾斜杠），但前端代码里是/api/shapes。若Express启用了严格路由模式，两者会被视为不同路径。可在主应用中统一配置，或修改前端请求路径避免末尾斜杠：

   app.set('strict routing', true); // 启用后严格区分路径末尾斜杠
   

3. 控制器逻辑修复（额外提醒）
   即使路由问题解决，当前控制器的SQL语句存在语法错误：INSERT不能搭配WHERE，应该用UPDATE更新用户数据，同时要给前端返回明确响应，避免请求挂起：

   db.query('UPDATE users SET shapes = ? WHERE id = ?', [JSON.stringify(shapesData), decoder.id], (err, result) => {
       if(err) {
           console.error(err);
           return res.status(500).json({error: '数据库更新失败'});
       }
       return res.status(200).json({success: '数据保存成功'});
   })
   

4. JSON请求体解析中间件配置
   确保主应用中已配置解析JSON请求体的中间件，否则req.body会是undefined，无法获取前端发送的shapesData：

   app.use(express.json());
   

内容的提问来源于stack exchange，提问作者Elemér Úram Kalapács