上传七牛云的方法

博客介绍了七牛云的使用,包括注册用户、保存密钥、新建空间、记录空间名、获取域名等操作,还提及了后端逻辑和前端逻辑,最后指出上传成功后需保存七牛云图片地址。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

七牛云的地址:https://portal.qiniu.com/home

注册一个用户
保存密钥
在这里插入图片描述
在这里插入图片描述
新建空间默认为华南必须认证身份才行
把空间名记录下来
在这里插入图片描述
点击开发者中心
在这里插入图片描述
点击对象存储
在这里插入图片描述
保存地址
在这里插入图片描述
获取域名
在这里插入图片描述
在这里插入图片描述

后端逻辑


from qiniu import Auth

# 七牛云的密钥
ak = 'qIpsogKsnioK63SvhCDMpIxE9-GHbZknWdOGOW4_'
sk = 'Gmg0YLb5QKzQYxAH2DspibMEsVloRmjfxjHU43L5'

def gen_token():
    q = Auth(ak, sk)

    # 生成七牛的token
    token = q.upload_token(bucket='p6123', expires=3600)

    return token


# 七牛token的视图
class QiniuTokenView(APIView):
    def get(self, request):
        # 成功七牛token
        token = gen_token()
        return Response({
            'code': 200,
            'msg': '七牛云token生成成功',
            'token': token
        })

前端逻辑

<el-form-item label="商品图片" prop="image">
	<!--  :action="保存的地址,把(s)取掉" -->
  <el-upload
    :action="'http://up-z2.qiniup.com'"
    :on-success="uploadSuccess"
    :data="upload_data"
    :on-error="uploadError"
  >
    <el-button size="small" type="primary">点击选择图片</el-button>
  </el-upload>
</el-form-item>
mounted() {
	this.axios
        .get("v1/goods/qiniuToken/", {
          headers: {
            Authorization: "JWT " + token,
          },
          responseType: "json",
        })
        .then((dat) => {
          // console.log("token>>>",dat.data);
          this.upload_data.token = dat.data.token;
        })
        .catch((err) => {
          console.log(err.response);
        });
  },

上传成功后保存七牛云图片地址

uploadSuccess(res, files) {
      console.log("上传的图片响应:", res);
      this.PicturesForm.image = 'http://' + '自己的域名' + '/' + res.key

      console.log("'上传成功',>>>", this.PicturesForm.image);
    },
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值