若依前后端分离版 集成 腾讯云 COS

FAlienDug2024-05-06 2:31

原因：

最近在根据一个若依二开的项目继续进行开发，当添加到轮播图模块的时候，涉及到了图片上传，由于公司以前一直使用的是腾讯云COS（不是阿里云OSS），在网上搜索一番后，没有找到 若依前后端分离版 COS 关键字的文章，只能根据阿里云OSS的文章进行模仿集成。

步骤：

添加腾讯云依赖

在根pom.xml中（最外层的pom文件）添加依赖

java 复制代码 
            <!--        Tencent COS-->
            <dependency>
                <groupId>com.qcloud</groupId>
                <artifactId>cos_api</artifactId>
                <version>${tencent.cos.version}</version>
            </dependency>

由于我使用的是 5.6.89 的版本，因此需要在 properties 标签中添加版本信息

java 复制代码 
        <tencent.cos.version>5.6.89</tencent.cos.version>

设置COS的必要参数

方式一：使用配置文件的方式设置COS参数（我没有使用这种方式，而是直接写死）

方式二：直接在代码中配置COS参数（我是用的这个方式）
在公共模块中建立Bean

ruoyi-common->src->main->java->com->ruoyi->common->config->TencentCosConfig.java

java 复制代码 
@Component
public class TencentCosConfig {

    /**
     * AccessKey
     */
    private String secretId;

    /**
     * AccessKey秘钥
     */
    private String secretKey;

    /**
     * bucket名称
     */
    private String bucketName;

    /**
     * bucket下文件夹的路径
     */
    private String region;

    /**
     * 访问域名
     */
    private String url;

    public String getSecretId() {
        return secretId;
    }

    public void setSecretId(String secretId) {
        this.secretId = secretId;
    }

    public String getSecretKey() {
        return secretKey;
    }

    public void setSecretKey(String secretKey) {
        this.secretKey = secretKey;
    }

    public String getBucketName() {
        return bucketName;
    }

    public void setBucketName(String bucketName) {
        this.bucketName = bucketName;
    }

    public String getRegion() {
        return region;
    }

    public void setRegion(String region) {
        this.region = region;
    }

    public String getUrl() {
        return url;
    }

    public void setUrl(String url) {
        this.url = url;
    }
}

在utils文件夹中新建oss文件夹，并在其内构建Utils工具类

ruoyi-common->src->main->java->com->ruoyi->common->utils->oss->TencentOssUploadUtils.java
为参数赋值

java 复制代码 
    private static TencentCosConfig tenantCosConfig;


    /**
     * 使用构造方法注入配置信息
     */
    @Autowired
    public TencentOssUploadUtils(TencentCosConfig tenantCosConfig) {
        // 写死
        tenantCosConfig.setSecretId("A*****omY9i");
        tenantCosConfig.setSecretKey("*****w");
        tenantCosConfig.setBucketName("****6");
        tenantCosConfig.setRegion("ap-***");
        tenantCosConfig.setUrl("https://***.cos.ap-chongqing.myqcloud.com");
        TencentOssUploadUtils.tenantCosConfig = tenantCosConfig;
    }

初始化COSClient

java 复制代码 
    /**
     * 初始化COSClient
     * @return
     */
    private static COSClient initCos(){
        // 1 初始化用户身份信息（secretId, secretKey）
        BasicCOSCredentials credentials = new BasicCOSCredentials(tenantCosConfig.getSecretId(), tenantCosConfig.getSecretKey());
        // 2 设置 bucket 的区域, COS 地域的简称请参照
        Region region = new Region(tenantCosConfig.getRegion());
        ClientConfig clientConfig = new ClientConfig(region);
        // 从 5.6.54 版本开始，默认使用了 https
        // clientConfig.setHttpProtocol(HttpProtocol.https);
        // 3 生成 cos 客户端。
        return new COSClient(credentials, clientConfig);
    }

创建 上传文件 方法

java 复制代码 
   /**
     * 上传文件
     * @param file
     * @return
     * @throws Exception
     */
    public static String uploadFile(MultipartFile file) throws Exception {

        // 生成 OSSClient
        //OSS ossClient = new OSSClientBuilder().build(tenantCosConfig.getEndpoint(), tenantCosConfig.getSecretId(), tenantCosConfig.getSecretKey());
        COSClient cosClient = initCos();
        // 原始文件名称
        // String originalFilename = file.getOriginalFilename();
        String filename = file.getOriginalFilename();
        InputStream inputStream = file.getInputStream();
        String filePath = getFilePath(filename);
        try {
            // 设置上传文件信息
            ObjectMetadata objectMetadata = new ObjectMetadata();
            objectMetadata.setContentLength(file.getSize());
            PutObjectRequest putObjectRequest = new PutObjectRequest(tenantCosConfig.getBucketName(), filePath, inputStream, objectMetadata);

            // 上传文件
            cosClient.putObject(putObjectRequest);
            cosClient.setBucketAcl(tenantCosConfig.getBucketName(), CannedAccessControlList.PublicRead);
            return tenantCosConfig.getUrl() + "/" + filePath;
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            cosClient.shutdown();
        }
        return tenantCosConfig.getUrl() + "/" + filePath;
    }

获取文件名方法

java 复制代码 
    private static String getFilePath(String fileName){
        String filePath = "xinxun/";
        String fileType = fileName.substring(fileName.lastIndexOf("."));
        filePath += RandomUtil.randomString(8) + fileType;
        return filePath;
    }

完整的方法

java 复制代码 
package com.ruoyi.common.utils.oss;


import cn.hutool.core.util.RandomUtil;
import com.qcloud.cos.COSClient;
import com.qcloud.cos.ClientConfig;
import com.qcloud.cos.auth.BasicCOSCredentials;
import com.qcloud.cos.model.CannedAccessControlList;
import com.qcloud.cos.model.ObjectMetadata;
import com.qcloud.cos.model.PutObjectRequest;
import com.qcloud.cos.region.Region;
import com.ruoyi.common.config.TencentCosConfig;
import com.ruoyi.common.utils.file.FileUploadUtils;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;
import org.springframework.web.multipart.MultipartFile;

import java.io.IOException;
import java.io.InputStream;

/**
 * @author zouhuu
 * @description 阿里云对象存储上传工具类
 * @date 2022/06/16 14:21:12
 */
@Slf4j
@Component
public class TencentOssUploadUtils {

    private static TencentCosConfig tenantCosConfig;


    /**
     * 使用构造方法注入配置信息
     */
    @Autowired
    public TencentOssUploadUtils(TencentCosConfig tenantCosConfig) {
        // 写死
        tenantCosConfig.setSecretId("A*****9i");
        tenantCosConfig.setSecretKey("J******CHCw");
        tenantCosConfig.setBucketName("****");
        tenantCosConfig.setRegion("ap-***");
        tenantCosConfig.setUrl("https://******ud.com");
        TencentOssUploadUtils.tenantCosConfig = tenantCosConfig;
    }

    /**
     * 上传文件
     * @param file
     * @return
     * @throws Exception
     */
    public static String uploadFile(MultipartFile file) throws Exception {

        // 生成 OSSClient
        //OSS ossClient = new OSSClientBuilder().build(tenantCosConfig.getEndpoint(), tenantCosConfig.getSecretId(), tenantCosConfig.getSecretKey());
        COSClient cosClient = initCos();
        // 原始文件名称
        // String originalFilename = file.getOriginalFilename();
        String filename = file.getOriginalFilename();
        InputStream inputStream = file.getInputStream();
        String filePath = getFilePath(filename);
        try {
            // 设置上传文件信息
            ObjectMetadata objectMetadata = new ObjectMetadata();
            objectMetadata.setContentLength(file.getSize());
            PutObjectRequest putObjectRequest = new PutObjectRequest(tenantCosConfig.getBucketName(), filePath, inputStream, objectMetadata);

            // 上传文件
            cosClient.putObject(putObjectRequest);
            cosClient.setBucketAcl(tenantCosConfig.getBucketName(), CannedAccessControlList.PublicRead);
            return tenantCosConfig.getUrl() + "/" + filePath;
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            cosClient.shutdown();
        }
        return tenantCosConfig.getUrl() + "/" + filePath;
    }

    private static String getFilePath(String fileName){
        String filePath = "xinxun/";
        String fileType = fileName.substring(fileName.lastIndexOf("."));
        filePath += RandomUtil.randomString(8) + fileType;
        return filePath;
    }

    /**
     * 初始化COSClient
     * @return
     */
    private static COSClient initCos(){
        // 1 初始化用户身份信息（secretId, secretKey）
        BasicCOSCredentials credentials = new BasicCOSCredentials(tenantCosConfig.getSecretId(), tenantCosConfig.getSecretKey());
        // 2 设置 bucket 的区域, COS 地域的简称请参照
        Region region = new Region(tenantCosConfig.getRegion());
        ClientConfig clientConfig = new ClientConfig(region);
        // 从 5.6.54 版本开始，默认使用了 https
        // clientConfig.setHttpProtocol(HttpProtocol.https);
        // 3 生成 cos 客户端。
        return new COSClient(credentials, clientConfig);
    }

}

修改图片上传方法

文件位置：

ruoyi-admin->src->main->java->com->ruoyi->web->controller->common->CommonController.java

通用上传请求（单个）

java 复制代码 
    /**
     * 通用上传请求（单个）
     */
    @PostMapping("/upload")
    public AjaxResult uploadFile(MultipartFile file) throws Exception {
        try
        {
            // 上传并返回新文件名称
            String url = TencentOssUploadUtils.uploadFile(file);
            AjaxResult ajax = AjaxResult.success();
            ajax.put("url", url);
            ajax.put("fileName", FileUtils.getName(url));
            ajax.put("originalFilename", file.getOriginalFilename());
            return ajax;
        }
        catch (Exception e)
        {
            return AjaxResult.error(e.getMessage());
        }
    }

注意事项

当修改完若依后端之后，还需要修改前端的imageUpload

java 复制代码 
// data里面 将baseUrl 的默认值改为""，不然就会在图片url中出现devapi

 baseUrl: "",

Over

相关推荐
frandiy14 小时前
核弹级技术革命——搭配deepseek-r1满血版的腾讯云ai助手（codex）仅用14天独立开发出适配ARM架构的微内核操作系统！
人工智能·架构·腾讯云
Anna_Tong1 天前
腾讯云安全加速：应对网络攻击与访问延迟的现实挑战
安全·云计算·腾讯云·企业安全·ddos·云安全·数据保护
渲染101专业云渲染1 天前
渲染101对Blender的支持与硬件配置详解
3d·云计算·blender·maya·houdini
严文文-Chris1 天前
【奥卡姆剃刀原理-如何理解云计算和边缘计算 关键字摘取】
人工智能·云计算·边缘计算
HaoHao_0101 天前
腾讯云 轻量云对象存储
云计算·腾讯云·存储·轻量云·套餐
稍带温度的风2 天前
Spring Boot + Vue 接入腾讯云人脸识别API（SDK版本3.1.830）
vue.js·spring boot·腾讯云
时间轴-小文同学2 天前
腾讯云cos 临时密钥 适用于前端直传等临时授权场景
前端·php·腾讯云
容器魔方2 天前
「挚文集团」正式加入 Karmada 用户组！携手社区共建多集群生态
云原生·容器·云计算
一个水货程序员2 天前
使用python接入腾讯云DeepSeek
python·腾讯云·fastapi
小狗很可爱2 天前
云计算相关
云计算
热门推荐
01DeepSeek各版本说明与优缺点分析02本地部署DeepSeek教程（Mac版本）03如何在WPS和Word/Excel中直接使用DeepSeek功能04DeepSeek R1本地化部署 Ollama + Chatbox 打造最强 AI 工具05太炸裂了！清华大学deepseek从入门到精通使用手册又出第三版了，《普通人如何抓住DeepSeek红利》（无套路，直接下载）06DeepSeek本地部署详细指南07从零安装 LLaMA-Factory 微调 Qwen 大模型成功及所有的坑08本地化部署AI知识库：基于Ollama+DeepSeek+AnythingLLM保姆级教程09DeepSeek r1本地安装全指南10保姆级教程：利用Ollama与Open-WebUI本地部署 DeedSeek-R1大模型