Angular多文件上传异常：API返回空数组（Postman可正常上传）

核心问题 #

你上传多文件的方式不符合FormData规范，导致后端无法正确解析文件列表：

• 你把所有文件打包成一个数组，通过formData.append("file", files)将数组作为值传入，后端接收的是一个数组对象而非多文件集合，因此返回空数组。
• Postman上传时是逐个添加文件，每个文件对应同一个字段名，这种格式后端才能正确解析为文件数组。

修正后的上传代码 #

直接遍历draftImages，将每个文件单独append到FormData中，保持字段名一致（这里用"file"，需和后端接收的字段名匹配）：

let formData = new FormData()

this.draftImages.forEach((fileData: any) => {
  // 第三个参数可选，用于指定文件名，确保后端获取正确的文件名
  formData.append("file", fileData.file, fileData.fileName)
})

this.http.post<any>("http://localhost:3000/chat/message/dm/uploadImg", formData).subscribe((result) => {
  console.log(result)
})

补充说明 #

• FormData的append方法如果使用同一个key多次添加数据，会自动生成多值结构，后端框架（如Express、Spring等）会将其解析为数组。
• 你的addFile函数没有问题，已经正确保存了File对象到draftImages中。

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