提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档
前言
提示:这里可以添加本文要记录的大概内容:
在我们写项目的时候时常会用到图片上传,这个时候我就可以使用七牛云来进行图片的上传
提示:以下是本篇文章正文内容,下面案例可供参考
二、使用步骤
1.创建文件
代码如下(示例):
在主项目下创建文件夹utils文件 , 然后在里面创建qiniu.py
2.获取七牛云token地址
代码如下(示例):
from qiniu import Auth, put_file, etag
import qiniu.config
#需要填写你的 Access Key 和 Secret Key
def aaa():
#需要填写你的 Access Key 和 Secret Key
access_key = '9tZxBlFvp2Ea6CMYYXWtkEIXybRvXXkVWN8FDRMi' #
secret_key = 'VzDflhDw4oSkOnsGr4TaYmUkpPzZTHBoknWaHHav'
#构建鉴权对象
q = Auth(access_key, secret_key)
#要上传的空间
bucket_name = '620371'
#生成上传 Token,可以指定过期时间等
token = q.upload_token(bucket_name,expires=3600*24)
#返回token
return token
3.写视图获取token
代码如下(示例):
from utils.qiniu import *
# 获取图片token
class TokenView(APIView):
def get(self,request):
token = token_name()
return Response({
'code':200,
'msg':'token发送成功',
'token':token
})
4.前端接受token
代码如下(示例):
get_token() {
get('token/')
.then((dat) => {
console.log("token>>>",dat.data);
this.upload_data.token = dat.data.token;
})
.catch((err) => {
console.log(err.response);
});
},
5.上传图片
代码如下(示例):
<el-upload
action="https://upload-cn-east-2.qiniup.com" //七牛云的上传地址
:auto-upload="true"
:on-success="uploadSuccess"
:data="upload_data"
:on-error="uploadError">
<el-button size="small" type="primary" >点击选择图片</el-button>
</el-upload>
6.生成图片地址
代码如下(示例):
// 点击上传,上传成功触发的方法
uploadSuccess(res, files,fiels_list) {
// res.key 获取上传的图片在七牛云存放的地址
// 拼接图片地址
this.imgUrl = "http://rhf1gdeiq.bkt.clouddn.com/" + res.key;
console.log("imgurl>>>", this.imgUrl);
},
总结
提示:这里对文章进行总结:
例如:以上就是今天要讲的内容,本文仅仅简单介绍了七牛云的使用