当前位置:首页 > 技术分享 > 正文内容

uni.uploadFile h5上传文件失败完美解决方案 h5上传文件后台无法获取

admin3年前 (2022-09-07)技术分享4623

小程序开发项目中,用到了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

扫描二维码推送至手机访问。

版权声明:本文由小刚刚技术博客发布,如需转载请注明出处。

本文链接:https://blog.bitefu.net/post/413.html

分享给朋友:

相关文章

thinkphp等框架开发中容易忽略的xss攻击及应对XSS攻击方法

thinkphp等框架开发中容易忽略的xss攻击及应对XSS攻击方法

虽然说现在的web开发框架都是挺成熟的框架,在性能、安全等方面都有比较好的表现,但问题往往出现在业务逻辑上,如上周我再公司发现的一个跨站脚本攻击,(通常公司是这么过滤的,max(0,$_GET[‘a’])、strip_tags($_GET[...

360浏览器如何禁止切换到兼容模式[本地终极办法]

360浏览器如何禁止切换到兼容模式[本地终极办法]

浏览器内核控制标签meta说明背景介绍由于众所周知的原因,国内的主流浏览器都是双核浏览器:基于Webkit的内核用于常用网站的高速浏览,基于IE的内核主要用于部分网银、政府、办公系统等网站的正常使用。以360浏览器为例,我们优先通过Webk...

input search更改默认删除按钮的样式

改input输入框search属性下输入文字之后会在输入框最后出现一个默认样式的X不过这个样式不太好看想自定义怎么办呢方法一input[type="search"]::-webkit-search-cancel-butt...

超高性比的斐讯盒子T1,刷第三方YYF固件机教程超级详细版

超高性比的斐讯盒子T1,刷第三方YYF固件机教程超级详细版

家里面买了斐讯盒子T1,必不可少的就是刷机,刷机一直爽,一直刷机一直爽,这样的快乐一般人体会不到。原来斐讯盒子N1,T1,还有斐讯K2P路由器也变成了性价比超高的东东,而且众多大神也带来了超多可玩性非常高的固件和破解。楼主今天扒到了相关超高...

安装Windows 10X 教你如何安装Win10X正式版 及下载地址

安装Windows 10X 教你如何安装Win10X正式版 及下载地址

安装Windows 10X 教你如何安装Win10X正式版:Windows 10X是Windows 10操作系统的新版本,主要针对双屏电脑。由于即将运行Windows 10X的双屏电脑(例如即将面世的Surface Neo)的开发遇到挫折,...

系统小技巧:微软版“Ghost” Windows FFU 系统安装还原

系统小技巧:微软版“Ghost” Windows FFU 系统安装还原

在日常的维护中,系统的备份和还原是大家经常需要操作的事情。虽然Windows 10已经提供很多的工具,如系统还原、WIM备份/还原,VHD备份等。不过这些工具大多是基于文件的备份/还原。我们以前经常的使用的Ghost则是基于扇区的备份/还原...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。