标签：跨域 完美 解决方案 OSS h5 403 uni 上传

 在使用阿里云OSS服务时，会用到跨域AJAX上传，上传时报403错误，之前遇到过此类问题并成功解决了，但时间长了遗忘，因此记录下来以备后续学习了解ajax跨域上传OSS。

ajax跨域上传首先会发送options请求，成功后再进行上传，那么，如何解决阿里云OSS跨域AJAX上传OPTIONS请求403问题？只需简单设置，流程如下：

进入存储空间（Bucket）  ——>  基础设置 ——> 跨域设置 ——> 添加规则，进入下图所示

设置以上规则后，就成功解决了阿里云OSS跨域AJAX上传OPTIONS请求403问题。

也可以参考uni.uploadFile h5上传文件失败完美解决方案，大致问题基本一样。

uni.uploadFile 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.teamsfy.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_da159c3b48f94f30927e899651064c47.html 

               http://www.teamsfy.com/html/r_28d3748f7a0449d8aeac8dd78a547f6e.html

标签：跨域,完美,解决方案,OSS,h5,403,uni,上传
来源： https://blog.csdn.net/a460550542/article/details/120077034

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。