cool-admin-midway 使用腾讯云cos上传图片

说明:在使用cool-admin这个低代码平台时,发现官方的cos上传插件有问题,总是报错 substring,故自己找解决方案,修改本地的upload方法改为云端上传。


解决方案:

  1. 安装腾讯云cos的nodeJS SDK
shell 复制代码
pnpm i cos-nodejs-sdk-v5
  1. admin-midway/src/modules/plugin/hooks/upload 目录下新建工具文件upload_cos.ts 内容如下:
typescript 复制代码
const COS: any = require('cos-nodejs-sdk-v5');
import fs = require('fs');

// 定义配置接口
interface CosConfig {
  Bucket?: string;
  Region?: string;
  Prefix?: string;
}

// 定义上传参数接口
interface PutObjectParam {
  key: string;
  buffer: fs.ReadStream | Buffer;
}

class CosUtil {
  private cos;
  private Bucket: string;
  private Region: string;
  private Prefix: string;

  // 构造函数,初始化配置
  constructor(config?: CosConfig) {
    this.Bucket = config?.Bucket || 'mybucket-xxxxxx'; // 存储桶名称
    this.Region = config?.Region || 'ap-guangzhou'; // 存储桶区域
    this.Prefix = config?.Prefix || ''; // 路径前缀

    // 初始化 COS 实例
    this.cos = new COS({
      SecretId: 'xxxxxx', // 密钥id
      SecretKey: 'xxxxxx', // 密钥key
    });
  }

  // 上传文件方法
  public putObject(param: PutObjectParam): Promise<any> {
    return new Promise((resolve, reject) => {
      this.cos.putObject(
        {
          Bucket: this.Bucket, // 必须
          Region: this.Region, // 必须
          Key: param.key, // 必须
          Body: param.buffer, // 必须
        },
        (err: Error, data: any) => {
          if (err) {
            reject(err);
            return;
          }
          resolve(data);
        }
      );
    });
  }
  
  // 提取图片链接中的图片名称
  public getName(imageUrl: string): string {
    // 解析 URL
    const parsedUrl = new URL(imageUrl);

    // 获取路径部分
    const pathname = parsedUrl.pathname;

    // 提取文件名
    const imageName = pathname.split('/').pop() || '';

    return imageName;
  }
}

export default CosUtil;
  1. 修改上述目录下的index.ts文件:
typescript 复制代码
// ... existing code ...
import CosUtil from './upload_cos';
// ... existing code ...

// 修改之前的上传文件代码
   /**
   * 上传文件
   * @param ctx
   * @param key 文件路径
   */
  async upload(ctx: any) {
    const { domain } = this.pluginInfo.config;
    const uploadUtil = new CosUtil();
    try {
      const { key } = ctx.fields;
      if (
        key &&
        (key.includes('..') ||
          key.includes('./') ||
          key.includes('\\') ||
          key.includes('//'))
      ) {
        throw new CoolCommException('非法的key值');
      }
      if (_.isEmpty(ctx.files)) {
        throw new CoolCommException('上传文件为空');
      }
      const basePath = pUploadPath();

      const file = ctx.files[0];
      const extension = file.filename.split('.').pop();
      const name =
        moment().format('YYYYMMDD') + '/' + (key || `${uuid()}.${extension}`);
      const target = path.join(basePath, name);
      const dirPath = path.join(basePath, moment().format('YYYYMMDD'));
      if (!fs.existsSync(dirPath)) {
        fs.mkdirSync(dirPath);
      }
      const data = fs.readFileSync(file.data);
      fs.writeFileSync(target, data);
      // 主要变动在这里,key:上传图片的名称(带后缀),buffer:图片的buffer
      const cosResult = await uploadUtil.putObject({
        key: name,
        buffer: data,
      });
      return `https://${cosResult.Location}`;
      
    } catch (err) {
      console.error(err);
      throw new CoolCommException('上传失败' + err.message);
    }
  }

通过以上修改,原来的upload方法及前端组建调用上传方法会得到返回的腾讯云cos存储桶中图片的访问地址,add接口也会把该地址存储到数据库中。

此时admin-node/src/modules/plugin/config.tsdomain参数将会失效

json 复制代码
// 基础插件配置
    hooks: {
      // 文件上传
      upload: {
        // 地址前缀
        domain: ``,
      },
    },

由于是非正式项目,存储桶访问权限设置的是公有读写,不需要做身份验证。如有需要可查看官方文档:设置存储桶访问权限

相关推荐
@HNUSTer2 小时前
基于 GEE 的 MODIS 昼夜地表温度数据可视化与导出全流程解决方案
云计算·数据集·遥感大数据·gee·云平台·modis·地表温度(lst)
王道长服务器 | 亚马逊云5 小时前
AWS WAF 实战篇|如何防御爬虫、CC攻击与恶意POST请求
云计算·aws
@HNUSTer5 小时前
基于 GEE MODIS 数据实现 7 大遥感指数计算与可视化
云计算·数据集·遥感大数据·gee·云平台·modis·遥感指数
TG_yunshuguoji21 小时前
阿里云国际代理商:有哪些文件适合阿里云CDN分发?
阿里云·云计算
哲霖软件1 天前
什么是机械设备制造ERP?哲霖软件如何助力企业实现降本增效?
云计算
光影少年1 天前
云计算生态及学习方向和就业领域方向
学习·云计算
Akamai中国2 天前
Linebreak赋能实时化企业转型:专业系统集成商携手Akamai以实时智能革新企业运营
人工智能·云计算·云服务
2401_865382502 天前
工信部发布→《云计算综合标准化体系建设指南(2025版)》
网络安全·云计算·信息安全技术
云宏信息2 天前
【深度解析】VMware替代的关键一环:云宏ROW快照如何实现高频业务下的“无感”数据保护?
服务器·网络·数据库·架构·云计算·快照
wanhengidc2 天前
如何使用云手机进行游戏挂机?
运维·服务器·游戏·智能手机·云计算