写在前面

1. 本人非腾讯员工，本SDK与官方无关。本SDK源码参考自官方小程序SDK源码：tencentyun/cos-wx-sdk-v5
2. 本人有正经工作，写这些就是吃饱了撑的，因此不提供任何技术支持。一切以腾讯云官方SDK为准；当然如果你给我爆点金币，我可以适当提供支持，但不会给你当孙子使，谢谢！
3. 本SDK屏蔽了官方 tencentyun/cos-wx-sdk-v5 下分片上传的代码，其它代码没有屏蔽。即：本包做不到分片上传；
4. 本SDK设计之初是给 uni-app 制作的 app 使用的，注意限定词，app。再次重申！如果非 app 平台，请尽可能使用官方的sdk
5. 本SDK设计支持是为了实现 使用临时上传授权信息+APP直传COS，没有测试其它API是否可用！所以超出这个范围的问题本人提供不了任何的技术支持，轻以官方文档为准！

伪代码

近期有小伙伴反馈还是很搞不明白怎么用，那么我来展示一下我的业务代码，本代码仅供参考，不可无脑复制粘贴！

前端部分

环境变量

# 环境变量的目的是方便维护，可以不设置
VITE_APP_COS_BUCKET=yunmariji-1309349906
VITE_APP_COS_REGION=ap-shanghai

业务代码

import COS from "cos-uni-sdk-v5"; // 必须！
import dayjs from "dayjs"; // 可选，这里我是为了生成对象的路径
import { getTempUploadAuthorization } from "../api/user.js"; // 这是官网络请求封装的，看字面意思就知道，获取临时授权信息的接口

const { VITE_APP_PREFIX_API, VITE_APP_COS_BUCKET, VITE_APP_COS_REGION } = import.meta.env;

// 初始化配置
let cos = new COS({
  SimpleUploadMethod: 'putObject',
  getAuthorization: function(options, callback) {
    getTempUploadAuthorization().then((res) => {
      callback({
        TmpSecretId: res.credentials.tmpSecretId,
        TmpSecretKey: res.credentials.tmpSecretKey,
        SecurityToken: res.credentials.sessionToken,
        StartTime: res.startTime,
        ExpiredTime: res.expiredTime,
      });
    })
  }
})

// 上传请求封装
export async function uploadTempFile(tempFilePath) {
  let ext = tempFilePath.split(".").pop();
  let dir = "uploads/" + dayjs().format('YYYY/MMDD') + "/" + Date.now() + "." + ext;

  let data = await cos.postObject({
    Bucket: VITE_APP_COS_BUCKET,
    Region: VITE_APP_COS_REGION,
    Key: dir,
    FilePath: tempFilePath
  });

  return "https://" + data.Location;
}

后端部分

后端其实没啥，直接看官方的示例就行了，我自己这边使用 php 的 webman 写的，伪代码如下。同理，如下代码时候从我核心业务代码精简来的，不要直接复制粘贴，核心代码就 getTempUploadAuthorization 这一块

<?php

namespace app\mini\controller;

use QCloud\COSSTS\Sts;

/**
 * @Title("用户-2024年12月03日")
 * @Sort(10)
 */
class UserController
{
    /**
     * @Title("获取临时上传授权信息")
     * @Method("GET")
     * @return Response
     */
    public function getTempUploadAuthorization(): Response
    {
        try {
            $sts = new Sts();
            return $this->returnResponse->success($sts->getTempKeys([
                "secretId" => getenv("COS_SECRET_ID"),
                "secretKey" => getenv("COS_SECRET_KEY"),
                "bucket" => getenv("COS_BUCKET"),
                "region" => getenv("COS_REGION"),
                "durationSeconds" => 60,
                "allowPrefix" => ["uploads/*"],
                "allowActions" => [
                    'name/cos:PutObject',
                    'name/cos:PostObject',
                ]
            ]));
        } catch (\Exception $e) {
            return $this->returnResponse->errorMessage($e->getMessage());
        }
    }
}

参考文档

为了节约兄弟们的对接时间，我直接把文档链接展示。各自职业看自己的文档就行；

前端部分

官方文档

对标，供参考，非100%复刻，具体见 写到前面 内的具体内容

• SDK使用：https://cloud.tencent.com/document/product/436/31953

后端部分

官方文档

• 临时秘钥生成：https://cloud.tencent.com/document/product/436/14048
• 示例代码（全部）：https://github.com/tencentyun/qcloud-cos-sts-sdk/tree/master
  • 示例代码（PHP）：https://github.com/tencentyun/qcloud-cos-sts-sdk/blob/master/php/demo/sts_test.php
  • 示例代码（Java）：https://github.com/tencentyun/qcloud-cos-sts-sdk/blob/master/java/src/test/java/com/tencent/cloud/CosStsClientTest.java
  • 示例代码（Nodejs）：https://github.com/tencentyun/qcloud-cos-sts-sdk/blob/master/nodejs/demo/sts-server.js

可能有用的文档

以下文档链接职业限定仅适用于正常项目使用场景，实际根据自己业务走。--- 宇宙免责条款

• 万象-图片处理（前端-自己拼后缀动态生成缩略图用）：https://cloud.tencent.com/document/product/436/44879
• 万象-视频处理（前端-上传视频可通过拼接url参数获取视频首图）：https://cloud.tencent.com/document/product/460/49283

支持作者

自愿打赏，金额不限，但是几毛钱、1块2块就算了，5块起步好吧！打赏与否跟你能否正常试用本插件没有任何关系；打赏不等于爆金币！请知悉！

支付宝收款码

微信收款码