uni.uploadFile h5上传文件失败完美解决方案 h5上传文件后台无法获取
在小程序开发项目中，用到了uni-app框架，但因为需要兼容h5，其中有图片上传，后台始终不能获取到上传的文件。
网上找了各种办法，发现很多小程序开发采用uni-app框架都遇到了同样的问题：uni.uploadFile h5上传文件后台无法获取，甚至还牵扯到了payload、form data传值方式。
后来，经过创软小程序开发团队不断尝试，发现只要取消header设置即可，不知道为什么，反正这样实现了。
小程序开发的uni-app h5上传文件代码参考如下：
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | uni.uploadFile({ url:'http://www.test.com', // 后端api接口 filePath: res.tempFilePaths[0], // uni.chooseImage函数调用后获取的本地文件路劲 name:'file', //后端通过'file'获取上传的文件对象 formData: { 'billGID': "xxxccc", 'token':"dddd" }, success:(res) => { console.log(res) }, fail: (err) => { console.log('uploadImage fail', err); uni.showModal({ content: err.errMsg, showCancel: false }); }}); |
当然，如果用到了跨域，需要设置 OPTIONS 请求，因为表单跨域上传文件，会先发送OPTIONS请求验证服务器是否可用。asp.net 跨域，在web.config中配置如下
1 2 3 4 5 6 7 8 9 | <system.webServer> <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET"/> <add name="Access-Control-Allow-Origin" value="*" /> </customHeaders> </httpProtocol></system.webServer> |
如果使用的阿里云OSS服务，阿里云OSS前端AJAX直接上传请参考阿里云OSS上传请求403问题的完美解决方案。
转自:http://www.teamsfy.com/html/r_28d3748f7a0449d8aeac8dd78a547f6e.html
![[钉钉]内网穿透之HTTP穿透](https://static-aliyun-doc.oss-accelerate.aliyuncs.com/assets/img/zh-CN/9904269951/p163821.png)
