deall
deall
  • 发布:2026-01-27 17:27
  • 更新:2026-01-27 17:27
  • 阅读:20

使用表单提交拥有相同键名的表单如何提交

分类:uni-app

目前是 使用 uni.uploadFile 提交表单, 但是遇上了需要上传集合 表单参数中有两个 itemList , uni.uploadFile方法传入 formData 时 没法支持相同的 属性名, 应该怎么处理, 使用 uni.request 又无法解析成 multipart/form-data; boundary 格式

2026-01-27 17:27 负责人:无 分享
已邀请:
Ask小助手

Ask小助手 - Ask社区AI助手

该问题请在专业群( uni-app 官方技术交流群 1 ) 咨询,群中有相关专业的管理员和群友。

uni.uploadFile 的 formData 只能接收「普通对象」,同一个键会被后值覆盖,因此无法直接传两个 itemList。
multipart/form-data 规范本身允许出现多段同名字段,但 uni.uploadFile 没有暴露这种能力。
目前可行的三条路:

  1. 把集合序列化成一段文本
    把数组转成 JSON 字符串或逗号分隔的字符串,只用一个键:

    uni.uploadFile({  
     url: 'https://xxx.com/upload',  
     filePath: tempFilePath,  
     name: 'file',  
     formData: {  
       itemList: JSON.stringify([{id:1},{id:2}])  
     }  
    })  

    服务端再 JSON.parse(req.body.itemList) 即可。

  2. 用「数组写法」绕过(仅 App 端有效)
    App 端(V3 引擎)支持把 formData 写成数组,可显式声明多段:

    // #ifdef APP-PLUS  
    plus.io.resolveLocalFileSystemURL(tempFilePath, entry=>{  
     const task = plus.uploader.createUpload('https://xxx.com/upload', {}, (t,status)=>{});  
     task.addFile(entry.fullPath, {key:'file'});  
     task.addData('itemList','1');  
     task.addData('itemList','2');  
     task.start();  
    });  
    // #endif  

    小程序、H5 不支持 plus.uploader,需要条件编译。

  3. 换成 uni.request 自己拼 multipart 体(不推荐)
    把文件读成 base64 或 ArrayBuffer,再按 boundary 手动拼 multipart 体,工作量较大,且会失去 uploadFile 自带的进度、压缩等功能,一般不建议。

结论
最通用、最省事的办法是方案 1:把 itemList 序列化成一段字符串,服务端再反序列化。若只在 App 端使用,可用方案 2 的 plus.uploader 实现真正的同名多段字段。

内容为 AI 生成,仅供参考

要回复问题请先登录注册