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

分片上传(结合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('视频上传失败')
        }
    }
}
复制代码

 

官方文档: 传送门

 

posted @   _zhiqiu  阅读(4901)  评论(2编辑  收藏  举报
编辑推荐:
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
阅读排行:
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
点击右上角即可分享
微信分享提示