分片上传(结合element-ui的upload组件实现自定义上传)

async uploadFree(content){
let data = await this.getOssToken(); //后台返回的OSS秘钥等等
let client = new OSS({
region: data.region,
accessKeyId: data.AccessKeyId,
accessKeySecret: data.AccessKeySecret,
stsToken: data.SecurityToken,
bucket: data.bucketName
});
try {
let result = await client.multipartUpload(content.file.name, content.file, {
progress: async function (p) {//这是上传进度条
content.onProgress({percent: parseInt(p * 100)+'%', returnValue: true });
}
});
return (content.file['response'] = [result].map(curr =>{//on-change回调的参数
return {
code: curr.res.status,
name: content.file.name,
data: curr.res.requestUrls[0].split('?')[0]
}
})[0]); } catch (e) {
console.log(e)
if (e.code === 'ConnectionTimeoutError') {
content.onError('视频上传超时')
throw "视频上传超时!";
}else{
content.onError('视频上传失败')
}
}
}

官方文档: 传送门

阿里云OSS 服务端签名后直传之分片上传(结合element-ui的upload组件)的更多相关文章

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

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

  2. Vue上传通过“服务端签名后直传”上传文件到阿里云 报错 400 Bad Request

    我报错的原因是 formData.append('file', file) 放在签名前面了 解决办法 formData.append('file', file) 一定在最后 /** * 上传文件到 o ...

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

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

  4. Ali OSS 服务端签名并设置回调,客户端上传文件

    一.最近做阿里云oss文件上传开发,一点收获分享给大家,帮助大家绕过一些坑.关于阿里云oss服务的介绍,我这里不做赘述了,可以查看阿里云OSS开发api文档. 在这里我主要介绍下,文件上传流程比较复杂 ...

  5. Python使用阿里云OSS服务

    Python使用阿里云OSS服务 前言: 在远程搭建了一个平台,通过改远程平台进行数据的采集,需要将数据内容传送至本地进行处理:为了实现该功能,考虑了阿里云的OSS对象储存的服务. 40G包月只需1元 ...

  6. PHP服务端如何通过程序将图上传到指定的图片服务器与图片服务器的优化方案

    一:PHP服务端如何通过程序将图上传到指定的图片服务器与图片服务器的优化方案 (1) php服务器把图片处理成缩率图或指定大小的图片在通过PHP程序代码 操作FTP 上传到图片服务器. 二:图片服务器 ...

  7. angulaijs中的ng-upload-file与阿里云oss服务的结合,实现在浏览器端上传文件到阿里云(速度可以达到1.5M)

    2015-10-26 angularjs结合aliyun浏览器端oos文件上传加临时身份验证例子 在服务端获取sts 源码: public class StsServiceSample { // 目前 ...

  8. ECS上nginx搭建反向代理通过内网访问阿里云OSS服务

    对于付不起钱的小伙计,为了给公司省钱,想尽一切招数.今天就来分享一个使用阿里云OSS存储搭配CDN使用的网站服务器部署方法. 简介 阿里云OSS 阿里云提供的一种文件存储方案,和我们以前接触的百度云B ...

  9. 物联网架构成长之路(18)-接阿里云OSS服务

    1.申请/购买OSS服务 在阿里云上申请/购买OSS服务, 然后在会得AccessKeyID,AccessKeySecret,bucketName 这三个东西 2.增删改查 在pom.xml文件上增加 ...

随机推荐

  1. 使用PyQtGraph绘制图形(1)

    首先利用numpy模块创建两个随机数组,用来作为图形绘制的数据: import pyqtgraph as pg import numpy as np x = np.random.random(50) ...

  2. Java操作符,<<、>>等

    数学意义:在数字没有溢出的前提下,对于正数和负数,左移一位都相当于乘以2的1次方,左移n位就相当于乘以2的n次方. 计算:3 << 2 3 << 2,则是将数字3左移2位 1. ...

  3. GatewayWorker与ThinkPHP等框架结合

    使用GatewayWorker时开发者最关心的是如何与现有mvc框架(ThinkPHP Yii laravel等)整合,以下是官方推荐的整合方式. 见示意图: ## 总体原则 现有mvc框架项目与Ga ...

  4. 修改MSSQL的端口地址_TcpPort_数据库安装工具_连载_2

    修改MSSQL的端口地址_TcpPort,可在程序中调用,从而修改TcpPort Use master Go ------------------------------ --1)在注册表中查询 Pi ...

  5. 其他函数-web_get_int_property

    用于记录http响应的信息.这个函数在调试脚本的常用,但是在实际压力测试中请将这些注释 使用这个函数可以获取到的信息有: 1.HTTP_INFO_RETURN_CODE:返回HTTP响应码 2.HTT ...

  6. 手写简易版Promise

    实现一个简易版 Promise 在完成符合 Promise/A+ 规范的代码之前,我们可以先来实现一个简易版 Promise,因为在面试中,如果你能实现出一个简易版的 Promise 基本可以过关了. ...

  7. cb41a_c++_STL_算法_填充新值fill_generate

    cb41a_c++_STL_算法_填充新值fill_generatefill(b,e,v)fill_n(b,n,v),填充n个vgenerate(b,e,p)generate_n(b,n,p) gen ...

  8. GIT本地库基本操作-命令行

    GIT本地库操作基本原理 GIT作为分布式版本库软件,每个机器上都是一个版本库. git初始化后,有三个区,分别是 工作区,暂存区,本地库: 工作区是我们编辑代码的区别,包括新增,修改,删除代码操作, ...

  9. 安装mysql报错:遇到缺少vcruntime140_1.dll文件

    把vcruntime140_1.dll文件放到System32 ,和System64就行 文件地址为:C:\Windows\System32 直接百度下载放进去就行

  10. Java-CORBA

    本文HelloCorba参考 Getting Started with JavaTM IDL 说在前面 Java TM IDL is a technology for distributed obje ...