ruoyivueplus配置minio

### RuoYi Vue Plus 中配置 MinIO 对象存储服务 #### 1. 准备工作 在开始之前，确保已经成功安装并运行了 MinIO 服务。可以通过 Linux 或 Windows 平台按照官方文档或参考资料进行部署[^2]。 对于 Docker 用户，在 Windows 上可以使用以下命令启动 MinIO 实例： ```bash docker run -p 9000:9000 \ --name minio1 \ -v D:\data:/data \ -e "MINIO_ROOT_USER=AKIAIOSFODNN7EXAMPLE" \ -e "MINIO_ROOT_PASSWORD=wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY" \ minio/mc server /data ``` 上述命令会将本地 `D:\data` 映射到容器内的 `/data` 路径作为数据存储位置，并设置访问凭证[^3]。 --- #### 2. 配置 MinIO 访问参数 在 RuoYi Vue Plus 项目的后端部分（Spring Boot），需要通过配置文件定义 MinIO 的连接信息： 编辑 `application.yml` 文件，添加如下内容： ```yaml spring: oss: type: minio # 设置为 MinIO 类型 endpoint: http://localhost:9000 # 替换为实际地址 access-key: AKIAIOSFODNN7EXAMPLE # 替换为您的 Access Key secret-key: wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY # 替换为您的 Secret Key bucket-name: test-bucket # 默认 Bucket 名称 ``` 如果启用了 HTTPS，则需调整 `endpoint` 地址以及可能涉及的证书验证逻辑[^1]。 --- #### 3. 后端接口开发 RuoYi Vue Plus 已经封装好了 MinIO 的上传功能，开发者只需调用对应的 API 即可完成操作。以下是核心代码片段示例： ##### (1) 添加依赖项 确认 Maven 项目中已引入 MinIO SDK： ```xml <dependency> <groupId>io.minio</groupId> <artifactId>minio</artifactId> <version>8.5.4</version> </dependency> ``` ##### (2) 编写上传方法 在 Spring Boot 控制器层编写文件上传接口： ```java @RestController @RequestMapping("/system/oss") public class OssController { @Autowired private MinioClient minioClient; /** * 文件上传至 MinIO */ @PostMapping("/upload") public ResponseEntity<String> uploadFile(@RequestParam("file") MultipartFile file) { try { String fileName = UUID.randomUUID().toString() + "_" + file.getOriginalFilename(); InputStream inputStream = file.getInputStream(); // 判断目标 Bucket 是否存在 boolean isExist = minioClient.bucketExists(BucketExistsArgs.builder() .bucket("test-bucket").build()); if (!isExist) { minioClient.makeBucket(MakeBucketArgs.builder() .bucket("test-bucket").build()); } // 执行文件上传 minioClient.putObject(PutObjectArgs.builder() .bucket("test-bucket") .object(fileName) .stream(inputStream, file.getSize(), -1) .contentType(file.getContentType()) .build()); return ResponseEntity.ok("http://localhost:9000/test-bucket/" + fileName); } catch (Exception e) { return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(e.getMessage()); } } } ``` 此代码实现了文件流读取、判断 Bucket 存在状态以及执行上传的核心流程[^4]。 --- #### 4. 前端集成 前端部分主要负责文件选择与提交动作。假设采用 Element UI 组件库实现多文件上传界面： HTML 结构： ```html <el-upload action="/system/oss/upload" multiple :on-success="handleSuccess"> <el-button size="small" type="primary">点击上传</el-button> </el-upload> <div v-if="uploadedFiles.length > 0"> <ul> <li v-for="(item, index) in uploadedFiles" :key="index">{{ item }}</li> </ul> </div> ``` Vue 方法处理回调： ```javascript export default { data() { return { uploadedFiles: [] }; }, methods: { handleSuccess(response) { this.uploadedFiles.push(response); // 动态更新已上传列表 } } }; ``` 以上代码展示了如何利用标准 HTTP 请求发送文件给后端，并实时展示返回的结果链接。 --- #### 总结 通过上述步骤即可完成 RuoYi Vue Plus 和 MinIO 的对接过程。重点在于合理配置后端环境变量、正确初始化客户端实例以及设计友好的交互体验。 ---