腾讯云对象存储使用

快速使用

1.注册腾讯云

2.进入对象存储-->存储桶列表-->创建存储桶

3.查看右上角sdk文档，根据文档走下来

1.安装sdk
手动安装：
直接拷贝js内容到项目目录utils下命名cos-wx-sdk-v5.js
npm安装：
npm install cos-wx-sdk-v5
2.小程序中引入
var COS = require('cos-wx-sdk-v5'); // 填写具体绝对路径
3.开始使用
线上产环境需微信公众平台配置后台域名访问白名单，选择【开发】>【开发设置】>【服务器域名】，配置域名白名单。

4.创建一个 COS SDK 实例，COS SDK 支持以下几种格式创建：

格式一（推荐）：后端通过获取临时密钥给到前端，前端计算签名。

var cos = new COS({
    // 必选参数
    getAuthorization: function (options, callback) {
        // 服务端 JS 和 PHP 示例：https://github.com/tencentyun/cos-js-sdk-v5/blob/master/server/
        // 服务端其他语言参考 COS STS SDK ：https://github.com/tencentyun/qcloud-cos-sts-sdk
        // STS 详细文档指引看：https://cloud.tencent.com/document/product/436/14048
        wx.request({
            // url这里填写你后端生成临时密钥的api地址
            url: 'https://example.com/server/sts.php',
            data: {
                // 可从 options 取需要的参数
            },
            success: function (result) {
                var data = result.data;
                var credentials = data && data.credentials;
                if (!data || !credentials) return 
                    console.error('credentials invalid');
                callback({
                    TmpSecretId: credentials.tmpSecretId,
                    TmpSecretKey: credentials.tmpSecretKey,
                    XCosSecurityToken: credentials.sessionToken,
                    // 建议返回服务器时间作为签名的开始时间，避免用户浏览器本地时间偏差过大导致签名错误
                    StartTime: data.startTime, // 时间戳，单位秒，如：1580000000
                    ExpiredTime: data.expiredTime, // 时间戳，单位秒，如：1580000900
                });
            }
        });
    }
});

后端生成临时密钥:

接口写好后，将生成密钥的地址填到上面的url中即可

1.获取SDK

pip install -U qcloud-python-sts

2.写接口

import json
import os
from sts.sts import Sts
​
class CredentialView(APIView):
    def get(sef,request,*args,**kwargs):
        config = {
        # 临时密钥有效时长，单位是秒
        'duration_seconds': 1800,
        'secret_id': 固定secret_id,
        'secret_key': 固定密钥,
        # 设置网络代理
        # 'proxy': {
        #     'http': 'xx',
        #     'https': 'xx'
        # },
        # 换成你的 bucket(存储桶)
        'bucket': 'example-1253653367',
        # 换成 bucket 所在地区
        'region': 'ap-guangzhou',
        # 这里改成允许的路径前缀，可以根据自己网站的用户登录态判断允许上传的具体路径
        # 例子： a.jpg 或者 a/* 或者 * (使用通配符*存在重大安全风险, 请谨慎评估使用)
        'allow_prefix': 'exampleobject', 
        # 密钥的权限列表。简单上传和分片需要以下的权限，其他权限列表请看 https://cloud.tencent.com/document/product/436/31923
        'allow_actions': [
        # 简单上传
        'name/cos:PutObject',
        'name/cos:PostObject',
        # 分片上传
        'name/cos:InitiateMultipartUpload',
        'name/cos:ListMultipartUploads',
        'name/cos:ListParts',
        'name/cos:UploadPart',
        'name/cos:CompleteMultipartUpload'
        ],
    }
​
    sts = Sts(config)
    response = sts.get_credential()
    return Response(response)

格式四：（不推荐）：前端使用固定密钥计算签名，该格式适用于前端调试，若使用此格式，请避免泄露密钥

var cos = new COS({
     SecretId: 'xxxxx',
     SecretKey: 'xxxxx',
   });

完整代码使用示例

小程序端：

这里使用格式1创建COS实例:

// 点击上传
  uploadImage() {
    // // 格式四：使用真实密钥，适合测试；不推荐，避免泄露密钥
    // var cos = new COS({
    //   SecretId: 'xxxxx',
    //   SecretKey: 'xxxxx',
    // });
    var cos = new COS({
      getAuthorization: function (options, callback) {
        wx.request({
          url: 'http://127.0.0.1:8000/api/credential',
          data: {
            // 可从options中取需要的参数
          },
          success: function (result) {
            var data = result.data;
            var credentials = data && data.credentials;
            callback({
              TmpSecretId: credentials.tmpSecretId,
              TmpSecretKey: credentials.tmpSecretKey,
              XCosSecurityToken: credentials.sessionToken,
              // 建议返回服务器时间作为签名的开始时间，避免用户浏览器本地时间偏差过大导致签名错误
              StartTime: data.startTime, // 时间戳，单位秒，如：1580000000
              ExpiredTime: data.expiredTime, // 时间戳，单位秒，如：1580000900
            });
          }
        });
      }
    });
    for (var index in this.data.imageList) {
      var filePath = this.data.imageList[index]
      cos.postObject({
        Bucket: 'auction-1302698597',
        Region: 'ap-shenzhen-fsi',
        Key: curr_time + index + '.png',
        FilePath: filePath,
        // 上传进度条
        onProgress: function (info) {
          console.log('上传进度条：', JSON.stringify(info));
        }
      }, function (err, data) {
        // 上传成功后执行
        // console.log('上传之后返回的值:', data.Location); // Location 图片对象地址(可直接访问)，然后保存地址到数据库即可
        wx.request({
          url: 'http://127.0.0.1:8000/api/photosView',
          method: 'POST',
          data: {
            img_url: data.Location
          },
          success(res) {
            // console.log(res.data)
            Notify({
              type: 'success',
              message: res.data.msg
            });
          }
        })
      });
    }
  },

后端生成临时密钥：

api地址：http://127.0.0.1:8000/api/photosView

from sts.sts import Sts
from django.conf import settings
​
class CredentialView(APIView):
    def get(self,request,*args,**kwargs):
        config = {
        # 临时密钥有效时长，单位是秒
        'duration_seconds': 1800,
        'secret_id': settings.SECRETID,
        'secret_key': settings.SECRETKEY,
        # 换成你的 bucket(存储桶)
        'bucket': 'auction-1302698597',
        # 换成 bucket 所在地区
        'region': 'ap-shenzhen-fsi',
        # 这里改成允许的路径前缀，可以根据自己网站的用户登录态判断允许上传的具体路径
        # 例子： a.jpg 或者 a/* 或者 * (使用通配符*存在重大安全风险, 请谨慎评估使用)
        'allow_prefix': '*',
        # 密钥的权限列表。简单上传和分片需要以下的权限，其他权限列表请看 https://cloud.tencent.com/document/product/436/31923
        'allow_actions': [
            # 简单上传
            'name/cos:PostObject',
        ],
        }
​
        sts = Sts(config)
        response = sts.get_credential()
        return Response(response)

删除云存储对象 

removeImage(e) {
    // 判断是否正在上传，如果正在上传就终止上传，已传成功则删除线上图片
    // 删除图片 终止 or 删除
    var index = e.detail.index
    var item = this.data.imgList[index]
    if(item.percent == 100) {
      // 使用上面创建的cos对象
      cos.deleteObject({
        Bucket: 'auction-1302698597',
        Region: 'ap-shenzhen-fsi',
        Key: item.key,
      }, (err, data) => {
        if (err) {
          wx.showToast({
            title: '删除失败',
            icon: 'none'
          })
        } else {
          // 同时删除页面显示
          let arr = this.data.imgList
          arr.splice(index, 1)
          this.setData({
            imgList: arr
          })
        }
      })
    }
  },

基本使用就是这样，需要更详细文档请看官方：https://cloud.tencent.com/document/product/436/31953