调用七牛云存储文件,返回url
2024-09-02 07:44:35
文档地址: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() // 上传取消
})
}
最新文章
- C#多线程 线程的启动
- 之三:CAAnimationGroup - 动画组
- SSH使用密钥登录并禁止口令登录实践
- DHCP中继
- BZOJ1766 : [Ceoi2009]photo
- Android开发-API指南-<;grant-uri-permission>;
- Cornerstone问题
- Stanford CoreNLP--Part of Speech
- Hu矩SVM训练及检测-----OpenCV
- C# 缩放图片
- 基于微博LBS API开发的周边美图android app
- webpack(3)-管理资源
- Ubuntu 16.04安装Notepadqq编辑器替代Notepad++
- 2017-2018-2 20155314《网络对抗技术》Exp7 网络欺诈防范
- 个人博客作业-Week1
- 微信小程序开发——苹果手机领取卡券出现参数错误(安卓正常)
- schwarz( 施瓦兹)不等式证明
- 树莓派 Zero WH 初使用体验
- Python概念-迭代器的__iter__和__next__
- numpy.random.shuffle()与numpy.random.permutation()的区别