调用七牛云存储文件，返回url

文档地址：https://developer.qiniu.com/kodo/sdk/1283/javascript#2

npm引入

npm install qiniu-js

例子：

var observable = qiniu.upload(file, key, token, putExtra, config)
var subscription = observable.subscribe(observer) // 上传开始
// or
var subscription = observable.subscribe(next, error, complete) // 这样传参形式也可以
subscription.unsubscribe() // 上传取消

参数说明：

file：上传的文件（files[0]）

key:自定义的路径

token：后台接口返回

config: object

var config = {
  useCdnDomain: true,
  region: qiniu.region.z2
};

var putExtra = {
  fname: "",
  params: {},
  mimeType: [] || null
};

其它的具体参数可取值可以参考文档

 

 

 

贴个具体上传的代码

selectPhoto(event){//上传身份证明文档（doc、docx） 照片
            var self=this;
            self.photoWordFormat=0;//重置一下
            if(event.target.files.length>0){
                var dianIndex=event.target.files[0].name.lastIndexOf('.'),
                    fileName,
                    file=event.target.files[0];
                if(dianIndex>-1){
                    fileName=event.target.files[0].name.slice(dianIndex);
                    if(fileName==".png"||fileName==".jpg"||fileName==".gif"){
                        if(file.size>5120000){
                            tools.alert('文件太大了, 不允许超过5M~');
                            return;
                        }
                        self.photoWorld=event.target.files[0].name;
                        self.photoWordFormat=1;//格式正确
                        var timestamp = (new Date()).valueOf();
                        var params={
                            file:file,//要上传的文件
                            key:"paper_file/"+timestamp+self.photoWorld,//自定义文件地址
                            token:self.token,
                            config:{
                                useCdnDomain: true,
                                region:undefined
                            },
                            putExtra:{
                                fname:self.photoWorld,
                                params: {},
                                mimeType: [] || null
                            },
                        }
                        self.upLoadQiniu(params);
                    }else{
                        tools.alert('请选择png,jpg,gif格式的文件，并且文件不能为空');
                        return;
                    }
                }  
            }
        },
        upLoadQiniu(params){//上传至七牛云
            var self=this;
            self.loading= layer.load(1, {//请求未成功时出现loading页 ,3代表一中效果
                shade: [0.1,'#fff'] //0.1透明度的白色背景
            });
            // 上传回调
            function next(res){
                // console.log(res);
            }
            function error(err){
                console.log(err);
            }
            function complete(res){
                var url="http://xxxxxx.cn/"+res.key;
                self.postObj.pic=url;
                layer.close(self.loading);//关闭loading效果
            }
            var observable = qiniu.upload(params.file, params.key, params.token, params.putExtra, params.config);
            var subscription = observable.subscribe(next, error, complete) // 这样传参形式也可以
            // subscription.unsubscribe() // 上传取消
        },

 

 

进一步在tools中封装成一个公共方法

/**
 * 
 * @param {*} file 上传的文件
 * @param {*} token 上传需要的token
 */
function qiniuUpLoadFun(file,token){//七牛上传方法
    return new Promise(function(resolve){
        var timestamp = (new Date()).valueOf();
        var params={
            file:file,//要上传的文件
            key:"paper_file/"+timestamp+file.name,//自定义文件地址
            token:token,
            config:{
                useCdnDomain: true,
                region:undefined
            },
            putExtra:{
                fname:file.name,
                params: {},
                mimeType: [] || null
            },
        }
        resolve(params);
    }).then(function(params){
        return upLoadQiniu(params);
    })
}
function upLoadQiniu(params){//上传至七牛云
    return new Promise(function(resolve){
        var loading= layer.load(1, {//请求未成功时出现loading页 ,3代表一种效果
            shade: [0.1,'#fff'] //0.1透明度的白色背景
        });
        // 上传回调
        function next(res){
            // console.log(res);
            console.log("上传中");
        }
        function error(err){
            console.log(err);
        }
        function complete(res){
            var url="http://xxxxxx.cn/"+res.key;
            layer.close(loading);//关闭loading效果
            resolve(url);
        }
        var observable = qiniu.upload(params.file, params.key, params.token, params.putExtra, params.config);
        var subscription = observable.subscribe(next, error, complete) // 这样传参形式也可以
        // subscription.unsubscribe() // 上传取消
    })
}