NodeJS使用Multer更新带图片表单时无图片上传返回404错误问题

1 核心触发404的原因 #

你定义的PUT接口路径为/:id（默认无末尾斜杠），但axios请求的路径末尾多了多余的斜杠：${baseURL}products/${item.id}/。Express默认开启严格路由匹配规则时，/products/xxx和/products/xxx/会被识别为两个完全不同的路径，因此请求根本匹配不到你编写的PUT接口，直接返回404，这也是接口内日志完全不触发的直接原因。

2 修复步骤 #

第一步：修正请求路径 #

删掉axios请求路径末尾的斜杠，修改为：

axios.put(`${baseURL}products/${item.id}`, formData, config)

修改后先测试不带图片的请求是否能正常进入接口逻辑。

第二步：处理Multer可选文件上传兼容 #

如果修正路径后还是出现不带图片就无响应的问题，是因为你使用的uploadOptions.single('image')中间件，在formData完全没有image字段时，部分旧版本Multer会出现请求挂起的问题，可修改中间件逻辑兼容可选上传：

// 原有multer配置不变，调整路由中间件写法
router.put("/:id", (req, res, next) => {
  const isFormData = req.headers['content-type']?.includes('multipart/form-data');
  if (isFormData) {
    return uploadOptions.single('image')(req, res, next);
  }
  next();
}, async (req,res)=>{
  // 原有业务逻辑保持不变
})

第三步：检查axios配置 #

确认你传入的config参数没有手动设置Content-Type: multipart/form-data，axios会自动为formData类型的请求添加正确的请求头和boundary参数，手动添加反而会导致服务端无法解析请求体。

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