前端忐忑历程

阿里OSS储存,上传下载

2018-02-03  本文已影响306人  小鳄鱼的大哥哦
//第一步,配置OSS信息,获取初始化需要的东西
//第二步,在OSS基础配置中配置跨域信息,请求头设置为*
//第三步,调用下面方法
//引入<script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
//上传 bxdOss.upLoad(获取文件的file)
//获取地址 bxdOss.downLoad(对应的文件名)
var bxdOss = {
    //初始化(基本配置)
    init: (function() {
        return client = new OSS.Wrapper({
            accessKeyId: '你的accessKeyId',
            accessKeySecret: '你的accessKeySecret',
            endpoint: '你的endpoint',
            bucket: '你的bucket'
        })
    })(),
    //上传, 参数 ==> 文件
    upLoad: function(file) {
        //生成UUID(我这边使用UUID来防止文件名冲突)
        var d = new Date().getTime();
        var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
            var r = (d + Math.random() * 16) % 16 | 0;
            d = Math.floor(d / 16);
            return(c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
        });
        //开始上传
        client.multipartUpload(uuid, file).then(function(result) {
            //成功之后的回调
            console.log(result);
        }).catch(function(err) {
            //失败之后的回调
            console.log(err);
        });
    },
    //下载,参数 ==> 文件名
    downLoad: function(objectKey) {
        var saveAs = 'download_file'; //下载的文件名为XXXX
        var result = client.signatureUrl(objectKey, {
            expires: 3600,
            response: {
        //成功之后的回调
                'content-disposition': 'attachment; filename="' + saveAs + '"'
            }
        });
        console.log(result);
        return result;
    }
}
//具体的回调函数已标明,根据自身需求更改
//上传
//document.getElementById('文件框ID').addEventListener('change', function (e) {
//  var file = e.target.files[0];
//  bxdOss.upLoad(file);
//  });
//上传之后会console一个文件名,用来下载
//获取对应的OSS路径
//bxdOss.downLoad(刚刚得到的文件名);
//查看console
上一篇下一篇

猜你喜欢

热点阅读