我报错的原因是 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. Oracle 中 decode 函数用法(字段A,B, C,A不为空则取A,否则取B,B为空则取C)

    –decode(条件,值1,返回值1,值2,返回值2,…值n,返回值n,缺省值) SELECT DECODE(TEMP.SCORE, ‘A’, ‘90-100’, ‘B’, ‘80-89’, ‘C’, ...

  2. 使用Spring-boot-admin对Spring boot的服务进行监控

    要进行监控,需要两个Project,一个是Admin Server端,负责监控Spring boot的项目,另一个是Admin Client端,是被监控的Spring boot服务. Admin Se ...

  3. c++练习—实现简单的4则运算

    #pragma once class Counter { public: void setExp(const char* exp);//设置表达式 void cleanExp(); //清除表达式 v ...

  4. Mathematically Hard LightOJ-1007(欧拉定理+前缀和)

    Description Mathematically some problems look hard. But with the help of the computer, some problems ...

  5. Linux试题亿点点

    1. 在登录Linux时,一个具有唯一进程ID号的shell将被调用,这个ID是什么(b) A.NID B.PID C.UID C.CID # process ID 进程id号 # UID 用户iD号 ...

  6. .Net面试题四

    1.C#编译成的dll存放在哪个目录?C#程序文件的后缀名是什么?.csproj后缀名是什么文件? 2.请写出C#中常用文件操作类.数据库操作类.网络请求类.每项至少写出三个 3.请定义一个只读属性: ...

  7. 怎样理解 Vue 的 "Hello, World!" 代码?

    直接复制以下代码到 html 文件中即可运行. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...

  8. 树莓派安装SSH

    1. 安装ssh sudo apt-get install openssh-server 2. 检查树莓派SSH服务是否开启 ps -e|grep ssh 3. SSH服务开启 sudo /etc/i ...

  9. 精心整理的一些 Python 学习资料

    今天花了些时间给大家精心整理一份 Python 学习资料.我觉得不错的资料我都整理进来了,如果你是学习python的,我觉得这一份资料对你应该有用. 1.知乎上超过 10k 的python相关回答 Y ...

  10. ubuntu系统新用户添加

    大概是4个步骤吧,是用脚本实现的,这里我列一下关键点 sudo useradd -m userYouWantAdd sudo passwd userYouWantAdd sudo usermod -a ...