将多图及其他数据存入MongoDB时仅保存单张图片如何解决

前端排查项 #

• 确认文件选择<input>标签已添加multiple属性，缺失该属性时浏览器默认仅支持单选文件
• 检查FormData拼接逻辑：需遍历所有选中的文件对象，统一使用带[]后缀的字段名追加，示例：

  // 正确写法
  selectedFiles.forEach(file => {
    formData.append('adImages[]', file)
  })
  // 错误写法1：只追加了第一个文件
  // formData.append('adImages', selectedFiles[0])
  // 错误写法2：未加[]后缀，多次追加同名字段会被覆盖
  // selectedFiles.forEach(file => formData.append('adImages', file))
  

• 提交前遍历FormData的entries打印校验，确认所有图片已被正确追加

后端multer配置排查项 #

• 确认multer接收字段配置为array类型而非single，且字段名与前端完全对应，示例：

  // 正确：接收adImages[]字段的最多10张图片
  upload.array('adImages[]', 10)
  // 错误：仅接收单张
  // upload.single('adImages')
  

• 打印req.files完整内容，若此处仅返回1张文件，说明multer未正确解析到多图，优先排查前后端字段名匹配问题

数据库存储排查项 #

• 检查Mongoose Schema对应图片字段为数组类型，示例：

  // 正确
  adImages: { type: [String], required: true }
  // 错误：字符串类型仅能存储单条路径
  // adImages: { type: String, required: true }
  

• 确认存储逻辑是将req.files中所有文件的路径/地址批量写入数组字段，而非仅取第一个文件的地址赋值

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