Multer错误解析FormData：所有字段包括图片均存放在req.body中

问题根源 #

• FormData的append()方法仅支持传入File、Blob、字符串三类值，你直接将图片文件数组作为参数传入，会被自动转为[object File],[object File]格式的普通字符串，multer无法识别为文件资源，因此会被归类到req.body中。
• 后端multer的upload.array("images")规则要求前端传递多个同名的images字段，每个字段对应单个文件，而非单个字段传递文件数组。

修复方案 #

前端代码修改 #

遍历图片数组，将每个文件单独追加到FormData的images字段下：

const state = {
  // other fields
  images: [], // array of image files
};

let formData = new FormData();
// append other fields
// 遍历数组逐个添加文件
state.images.forEach(image => {
  formData.append("images", image);
});

await fetch(url, {
  method: "POST",
  body: formData,
  // 注意：不要手动设置Content-Type请求头，浏览器会自动生成带boundary标识的正确请求头
  // 其他配置
});

后端验证 #

原multer配置无需修改，上传成功后文件会被存入req.files数组，普通字段仍存放在req.body中，可在业务逻辑中直接取用：

// controller.js 示例
exports.handleImagePost = (req, res) => {
  console.log("上传的文件列表：", req.files);
  console.log("其他表单字段：", req.body);
  // 后续业务逻辑
}

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