React Native如何上传多张图片至服务端？单图正常多图上传失败如何解决

问题原因 #

你当前的写法是直接将文件对象数组整体传入FormData.append方法，React Native环境下的FormData不会自动解析数组内的文件对象，会直接将数组转为字符串传输，后端无法识别为多文件结构；单张上传能成功是因为数组只有一个元素，部分后端兼容了这种错误格式的解析。

修复方法 #

核心逻辑 #

遍历所有待上传的图片，逐个将单个图片对象append到同名字段下，不需要包裹数组外层。

正确代码示例 #

const data = new FormData();
// images为所有待上传的图片数组
images.forEach((item, i) => {
  data.append("media_files", {
    uri: item.uri,
    type: item.mime,
    name: item.name || `filename${i}.jpg`,
  });
});

// 若后端要求多文件字段带数组标识，将字段名改为media_files[]即可
// data.append("media_files[]", 单个文件对象)

额外注意事项 #

• 上传请求的Content-Type必须设置为multipart/form-data，使用axios等第三方请求库时会自动识别FormData对象添加该头，手动发送请求时需主动指定
• 图片的uri必须为file://开头的本地绝对路径，不能是相对路径或临时路径别名
• 不要省略type（MIME类型）和name字段，否则原生上传模块会识别失败

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