我报错的原因是 formData.append('file', file) 放在签名前面了

解决办法 formData.append('file', file) 一定在最后

/**
* 上传文件到 oss
* @param {} Object Sign 签名
* @param {*} file 要上传的文件
*/
export const updateFileToOSS = (sing, file) => {
// console.log(file)
const formData = new FormData()
formData.append('key', sing.key)
formData.append('OSSAccessKeyId', sing.accessid)
formData.append('policy', sing.policy)
formData.append('signature', sing.signature)
formData.append('success_action_status', '201')
formData.append('file', file) // 一定在最后
return new Promise((resolve, reject) => {
axios({
method: 'POST',
url: '/oss', // 设置代理了
data: formData,
headers:{
'Authorization': Vue.ls.get(ACCESS_TOKEN), // 请求头携带的token
'Content-Type': 'multipart/form-data'
}
}).then((response) => {
resolve(response)
}).catch(error => {
reject(error)
})
})
}

感谢 原文 https://segmentfault.com/a/1190000019481380

Vue上传通过“服务端签名后直传”上传文件到阿里云 报错 400 Bad Request的更多相关文章

  1. 使用阿里云OSS的服务端签名后直传功能

    网站一般都会有上传功能,而对象存储服务oss是一个很好的选择.可以快速的搭建起自己的上传文件功能. 该文章以使用阿里云的OSS功能为例,记录如何在客户端使用阿里云的对象存储服务. 服务端签名后直传 背 ...

  2. 阿里云OSS 服务端签名后直传之分片上传(结合element-ui的upload组件)

    分片上传(结合element-ui的upload组件实现自定义上传) async uploadFree(content){ let data = await this.getOssToken(); / ...

  3. python踩坑系列——报错后修改了.py文件,但是依然报错

    一开始.py文件中的函数名大小写错了,但是在终端是对的,报错: 'module' object has no attribute '某函数名' 后来就去修改.py文件.结果重新import该.py文件 ...

  4. Ali OSS服务端签名直传并设置上传回调

    服务端签名直传并设置上传回调 背景 请参考 Web端直传实践 里的背景介绍. 当采用服务端签名后直传方案后,问题来了,用户上传数据后,很多场景下,应用服务器都要知道用户上传了哪些文件,文件名字,甚至如 ...

  5. 使用axios上传文件到阿里云对象文件存储服务器oss

    背景 OSS可用于图片.音视频.日志等海量文件的存储.各种终端设备.Web网站程序.移动应用可以直接向OSS写入或读取数据.OSS支持流式写入和文件写入两种方式.使用阿里云oss做文件存储的时候,不可 ...

  6. 在OneThink(ThinkPHP3.2.3)中整合阿里云OSS的PHP-SDK2.0.4,实现Web端直传,服务端签名直传并设置上传回调的实现流程

    在OneThink(ThinkPHP3.2.3)中整合阿里云OSS的PHP-SDK2.0.4,实现本地文件上传流程 by shuijingwan · 2016/01/13 1.SDK安装 github ...

  7. Vue UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例

    Vue UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例 element ★11612 - 饿了么出品的Vue2的web UI工具套件 Vux ★7503 - 基于Vue和WeUI的组件库 ...

  8. 使用 PHP 来做 Vue.js 的 SSR 服务端渲染

    对于客户端应用来说,服务端渲染是一个热门话题.然而不幸的是,这并不是一件容易的事,尤其是对于不用 Node.js 环境开发的人来说. 我发布了两个库让 PHP 从服务端渲染成为可能.spatie/se ...

  9. 支付宝ios支付请求Java服务端签名报的一个错(ALI40247) 原创

    今天做app的支付宝支付,遇到些问题,以前做支付宝支付签名都是直接在客户端App进行,今天下了最新版本ios的支付宝支付demo,运行demo时底部有红色的显眼字体,告知用户签名必须在服务端进行... ...

随机推荐

  1. MGR+Consul+ProxySQL

    ---------------------------------------------------------------------------------------------------- ...

  2. Codeforces 1237E. Balanced Binary Search Trees

    传送门 这一题是真的坑人,时间空间都在鼓励你用 $NTT$ 优化 $dp$...(但是我并不会 $NTT$) 看到题目然后考虑树形 $dp$ ,设 $f[i][0/1]$ 表示 $i$ 个节点的树,根 ...

  3. java——包装类数据缓存 ==号详解

    Java对部分经常使用的数据采用缓存技术,即第一次使用该数据则创建该数据对象并对其进行缓存, 当再次使用等值对象时直接从缓存中获取,从而提高了程序执行性能.(只对常用数据进行缓存) Java中只是对部 ...

  4. O027、看nova-scheduler如何选择计算节点

    参考https://www.cnblogs.com/CloudMan6/p/5441782.html   本节重点介绍 nova-scheduler 的调度机制和实现方法:即解决如何选择在那个计算节点 ...

  5. linux mint 安装微信

    安装nodejs 到nodejs官网下载node js压缩包,然后解压到自己设置的目录.我的解压路径是 /home/congwiny/Develop/SoftWare/node-v6.10.3-lin ...

  6. [Eclipse的Maven项目搭建,仅为测试Maven功能]如何在Eclipse下搭建Maven项目

    [Eclipse的Maven项目搭建,仅为测试Maven功能]如何在Eclipse下搭建Maven项目   你可能需要了解以下才能更好的阅读以下: 在 Windows 中配置Maven: http:/ ...

  7. (备忘)Java数据类型中String、Integer、int相互间的转换

    1.Integer转换成int的方法 Integer i; int k = i.intValue();即Integer.intValue(); 2.int转换成Integer int i; Integ ...

  8. Linux下pwn从入门到放弃

    Linux下pwn从入门到放弃 0x0 简介 pwn,在安全领域中指的是通过二进制/系统调用等方式获得目标主机的shell. 虽然web系统在互联网中占有比较大的分量,但是随着移动端,ioT的逐渐流行 ...

  9. 构建虚拟工控环境系列 - 罗克韦尔虚拟PLC

    一. 概述 本篇主要介绍罗克韦尔虚拟PLC的搭建,使用的操作系统为Windows7 x86 Ultimate(DEEP_GHOST_WIN7_SP1_X86_V2015_06.iso),虚拟化软件为 ...

  10. Percona MongoDB 4 搭建副本集

    什么是副本集: 是一组维护相同数据集的mongod进程 提供冗余,自动故障转移和高可用性 提供读取可伸缩性 内部概念或多或少与MySQL的概念相似 PRIMARY概念与MySQL复制中的MASTER大 ...