电子产品网站建设策划方案,好用的快速网站建设平台,网站去掉index.html,关键词优化怎么写我们传统使用MinIo做OSS对象存储的应用方式往往都是在后端配置与MinIO的连接和文件上传下载的相关接口#xff0c;然后我们在前端调用这些接口完成文件的上传下载机制#xff0c;但是#xff0c;当并发量过大#xff0c;频繁访问会对后端的并发往往会对服务器造成极大的压力…我们传统使用MinIo做OSS对象存储的应用方式往往都是在后端配置与MinIO的连接和文件上传下载的相关接口然后我们在前端调用这些接口完成文件的上传下载机制但是当并发量过大频繁访问会对后端的并发往往会对服务器造成极大的压力大文件传输场景下服务器被迫承担数据中转的角色既消耗大量带宽资源又形成单点性能瓶颈。这时我们引入了MinIO的一种预签名机制。 预签名机制在后端对文件的上传和下载操作生成一个URL前端针对不同的文件操作形式请求会获取到对应的URL这个URL可以理解为一个临时的通行证有了这个URL后前端可以直接向MinIO的服务端发上传和下载的相应请求与MinIO直连操作大大减缓了对后端服务器的压力 1.后端配置 1.1 引入Maven依赖并配置MinIO !--minio-- dependencygroupIdio.minio/groupIdartifactIdminio/artifactId /dependency /** MinIO配置类* Author GuihaoLv*/ Configuration EnableConfigurationProperties(MinIoProperties.class) public class MinIoConfiguration {Autowiredprivate MinIoProperties properties;Beanpublic MinioClient minioClient() {return MinioClient.builder().endpoint(properties.getEndpoint()).credentials(properties.getAccessKey(), properties.getSecretKey()).build();}}1.2 生成预签名接口封装 /**要改成使用预签名URL让前端直接与MinIO交互减轻服务器负担。* 生成上传预签名URLPUT* param fileName* return*/ GetMapping(/presigned-upload-url) ApiOperation(获取上传预签名URL) public ResultString generateUploadUrl(RequestParam(fileName) String fileName) {System.out.println(测试fileName);String url commonFileService.generatePresignedUploadUrl(fileName);System.out.println(结构url);return Result.success(url); }/**要改成使用预签名URL让前端直接与MinIO交互减轻服务器负担。* 生成下载预签名URLGET* param fileName* return*/ GetMapping(/presigned-download-url) ApiOperation(获取下载预签名URL) public ResultString generateDownloadUrl(RequestParam(fileName) String fileName) {String url commonFileService.generatePresignedDownloadUrl(fileName);return Result.success(url); } /**生成上传预签名URLPUT* param fileName* return*/ public String generatePresignedUploadUrl(String fileName) {try {// 安全处理文件名防止路径遍历String safeFileName sanitizeFileName(fileName);// 生成预签名URLPUT方法return client.getPresignedObjectUrl(GetPresignedObjectUrlArgs.builder().method(Method.PUT).bucket(properties.getBucketName()).object(safeFileName).expiry(15, TimeUnit.MINUTES) // 15分钟有效.build());} catch (Exception e) {throw new RuntimeException(生成预签名URL失败, e);} }/*** 生成下载预签名URLGET* param fileName* return*/ public String generatePresignedDownloadUrl(String fileName) {try {String safeFileName sanitizeFileName(fileName);return client.getPresignedObjectUrl(GetPresignedObjectUrlArgs.builder().method(Method.GET).bucket(properties.getBucketName()).object(safeFileName).expiry(1, TimeUnit.HOURS) // 1小时有效.build());} catch (Exception e) {throw new RuntimeException(生成预签名URL失败, e);} }// 文件名安全处理 private String sanitizeFileName(String fileName) {// 过滤非法字符防止路径遍历return fileName.replaceAll([^a-zA-Z0-9-_.], ); } 1.3 前端封装获取预签名和直连MinIO做上传下载的请求 // 获取上传预签名URL export const getPresignedUploadUrl (fileName) {return httpInstance({url: /web/commonFile/presigned-upload-url,method: GET,params: { fileName },}); };// 获取下载预签名URL export const getPresignedDownloadUrl (fileName) {return httpInstance({url: /web/commonFile/presigned-download-url,method: GET,params: { fileName },}); };// 单个文件直传MinIO上传文件 export const uploadViaPresignedUrl async (file: File) {try {// 步骤1: 获取未编码的原始文件名需与后端生成的签名匹配const rawFileName file.name;// 步骤2: 调用后端接口获取预签名URL必须传递原始文件名const resawait getPresignedUploadUrl(rawFileName);const presignedUrlres.data;// 调试输出验证URL格式console.log([DEBUG] 预签名URL:, presignedUrl); // 应输出类似 http://47.99.49.193:9000/...// 步骤3: 直接向MinIO发送PUT请求绕过代理const response await axios.put(presignedUrl, file, {// 关键配置禁用代理和默认请求头baseURL: , // [!code ] 清除默认baseURLheaders: {Content-Type: application/octet-stream // MinIO通用类型}});return response.data;} catch (error) {throw new Error(上传失败: ${(error).response?.data || error.message});} };// 使用预签名URL直连MinIO下载文件 export const downloadViaPresignedUrl async (fileName) {try {// 1. 获取预签名URL调用后端接口生成临时有效的下载URLconst { data: { data: presignedUrl } } await getPresignedDownloadUrl(fileName);// 2. 创建隐藏链接触发下载const link document.createElement(a);link.href presignedUrl; // 设置URLlink.download fileName; // 设置下载文件名需与 MinIO 存储的文件名一致。document.body.appendChild(link); // 将链接添加到DOMlink.click(); // 模拟点击触发下载document.body.removeChild(link); // 移除临时链接return true; // 表示下载已触发} catch (error) {throw new Error(下载失败: error.message); // 统一错误处理} }; 1.4写一个前端页面测试前端直连MinIO的功能实现 script setup langts import { ref } from vue; import {uploadViaPresignedUrl,downloadViaPresignedUrl } from /api/file;// 定义响应式变量 const selectedFile refFile | null(null); // 存储用户选择的文件 const downloadFileName refstring(); // 下载时输入的文件名 const uploadStatus refstring(); // 上传状态提示 const downloadStatus refstring(); // 下载状态提示// 处理文件选择事件 const handleFileChange (event: Event) {const target event.target as HTMLInputElement;if (target.files target.files.length 0) {selectedFile.value target.files[0];uploadStatus.value ; // 重置上传状态} };// 上传文件到MinIO const uploadFile async () {uploadStatus.value 上传中...;await uploadViaPresignedUrl(selectedFile.value);uploadStatus.value 上传成功;selectedFile.value null; // 清空文件选择 }// 下载文件从MinIO const downloadFile async () {downloadStatus.value 正在触发下载...;const success await downloadViaPresignedUrl(downloadFileName.value);if (success) {downloadStatus.value 下载已触发;}}; /scripttemplatediv classcontainer!-- 上传文件部分 --h2测试MinIO文件上传/h2input typefile changehandleFileChange /button clickuploadFile :disabled!selectedFile上传/buttonp{{ uploadStatus }}/p!-- 下载文件部分 --h2测试MinIO文件下载/h2inputv-modeldownloadFileNametypetextplaceholder请输入文件名如 test.jpg/button clickdownloadFile下载/buttonp{{ downloadStatus }}/p/div /template 上传测试结果   下载测试