wordpress 页面上显示文章,网站手机版跳转 seo,哪些网站可做矿机期货,网站图标生成SpringBoot整合OSS实现文件上传
以前,文件上传到本地(服务器,磁盘),文件多,大,会影响服务器性能
如何解决? 使用文件服务器单独存储这些文件,例如商业版–七牛云存储,阿里云OSS,腾讯云cos等等
也可以自己搭建文件服务器(FastDFS,minio)
0 过程中需要实名认证
…
1 开…SpringBoot整合OSS实现文件上传
以前,文件上传到本地(服务器,磁盘),文件多,大,会影响服务器性能
如何解决? 使用文件服务器单独存储这些文件,例如商业版–七牛云存储,阿里云OSS,腾讯云cos等等
也可以自己搭建文件服务器(FastDFS,minio)
0 过程中需要实名认证
…
1 开通阿里云OSS 2 创建bucket 其他不用管,直接完成即可
3 获取AccessKeyId、AccessKeySecret 墙裂建议,保存好此文件,因为后续无法再查看,只能删除重建 4 获取外网访问域名 Endpoint地域节点: xxxxx
Bucket 域名 : xxxxx
5 创建文件夹 oss中存储在app/upload下
6 添加依赖 !-- 阿里云OSS--dependencygroupIdcom.aliyun.oss/groupIdartifactIdaliyun-sdk-oss/artifactIdversion3.10.2/version/dependencydependencygroupIdcommons-fileupload/groupIdartifactIdcommons-fileupload/artifactIdversion1.3.1/version/dependency7 封装常量类
根据自己实际情况改变
public class AliyunOSSConstants {// OSS唯一keypublic static final String ASSCESS_KEY_ID 你的ASSCESS_KEY_ID;// OSS唯一key秘钥public static final String ASSCESS_KEY_SECRET 你的ASSCESS_KEY_SECRET;// 地域节点public static final String END_POINT 你的地域节点;// Bucket名称public static final String BUCKET_NAME 你的Bucket名称;// 文件一级路径public static final String FILE_DIR oss中创建的文件路径;// 文件访问域名public static final String COMMON_URL 这个是后续访问的公共路径前缀;}
8 封装工具类
package com.qf.util;import com.aliyun.oss.ClientException;
import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClientBuilder;
import com.aliyun.oss.OSSException;
import com.aliyun.oss.model.CannedAccessControlList;
import com.aliyun.oss.model.CreateBucketRequest;
import com.aliyun.oss.model.PutObjectRequest;
import com.aliyun.oss.model.PutObjectResult;
import org.springframework.web.multipart.MultipartFile;import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.UUID;/*** --- 天道酬勤 ---** author QiuShiju* date 2024/12/08* desc*/
public class AliyunOSSUtil {/*** 上传文件*/public static String upLoad(MultipartFile file) {System.out.println(------OSS文件上传开始-------- );String endPoint AliyunOSSConstants.END_POINT;String accessKeyId AliyunOSSConstants.ASSCESS_KEY_ID;String accessKeySecret AliyunOSSConstants.ASSCESS_KEY_SECRET;String bucketName AliyunOSSConstants.BUCKET_NAME;String fileDir AliyunOSSConstants.FILE_DIR;SimpleDateFormat format new SimpleDateFormat(yyyy-MM-dd);String dateStr format.format(new Date( ));String fileUrl null;OSS client new OSSClientBuilder( ).build(endPoint, accessKeyId, accessKeySecret);try {// 判断容器是否存在,不存在就创建if (!client.doesBucketExist(bucketName)) {client.createBucket(bucketName);CreateBucketRequest createBucketRequest new CreateBucketRequest(bucketName);createBucketRequest.setCannedACL(CannedAccessControlList.PublicRead);client.createBucket(createBucketRequest);}String originalFilename file.getOriginalFilename( );String suffix originalFilename.substring(originalFilename.indexOf(.));// 设置文件路径和名称fileUrl fileDir / (dateStr / UUID.randomUUID( ).toString( ).replace(-, ) suffix);System.out.println(fileUrl fileUrl);// 上传文件PutObjectResult result client.putObject(new PutObjectRequest(bucketName, fileUrl, file.getInputStream( )));// 设置权限(公开读)client.setBucketAcl(bucketName, CannedAccessControlList.PublicRead);if (result ! null) {System.out.println(resp result);System.out.println(------OSS文件上传成功------ AliyunOSSConstants.COMMON_URL fileUrl);}} catch (OSSException oe) {oe.printStackTrace();} catch (ClientException ce) {ce.printStackTrace();} catch (IOException e) {e.printStackTrace( );} finally {if (client ! null) {client.shutdown( );}}return AliyunOSSConstants.COMMON_URL fileUrl;}/*** 删除文件*/public static String delete(String fileUrl) {System.out.println(------OSS文件删除开始-------- fileUrl);String endPoint AliyunOSSConstants.END_POINT;String accessKeyId AliyunOSSConstants.ASSCESS_KEY_ID;String accessKeySecret AliyunOSSConstants.ASSCESS_KEY_SECRET;String bucketName AliyunOSSConstants.BUCKET_NAME;OSS client new OSSClientBuilder( ).build(endPoint, accessKeyId, accessKeySecret);try {client.deleteObject(bucketName, fileUrl);System.out.println(------OSS文件删除成功------ AliyunOSSConstants.COMMON_URL fileUrl);} catch (OSSException oe) {oe.printStackTrace();} catch (ClientException ce) {ce.printStackTrace();} finally {if (client ! null) {client.shutdown( );}}return AliyunOSSConstants.COMMON_URL fileUrl;}
}9 接口测试
RestController
public class UploadController {/*** 演示上传文件到OSS*/PostMapping(/upload)public R upload(MultipartFile file){String filePath AliyunOSSUtil.upLoad(file);return R.ok(filePath);}}10 前端
templatedivh2文件上传/h2!--:http-requestuploadFile 是用来覆盖默认的action的请求路径的action不能删除,因为是el-upload组件必填参数,不填会报错-- el-uploadclassupload-demodragaction:http-requestuploadFile :on-changehandleChangemultiplei classel-icon-upload/idiv classel-upload__text将文件拖到此处或em点击上传/em/div/el-uploaddiv!-- 上传后展现图片的地方 -- img :srcfileSrc width200px/div/div/templatescript
import {uploadPicture} from /api/upload
export default {data(){return{file:null,fileSrc:null}},methods:{handleChange(file){this.file file.raw;},uploadFile(){const file this.file;// FormData是js对象,用于存储表单数据 const formData new FormData();formData.append(file, file); // 由后端接口决定,后端参数叫fileuploadPicture(formData).then((res) {this.$message({message: 上传成功,type: success,});this.fileSrc res.dataconsole.log(fileSrc,this.fileSrc)});}}
}
/scriptstyle scoped langscss/style使用:http-request指定文件上传的函数原有的action、:before-upload、:on-success等不起作用。但删去action可能有报错所以还是写了action“”。 uploadPicture()是封装的函数,在upload.js中
import request from /utils/requestexport function uploadPicture(data) {return request({url: /upload,method: post,data})
}11 测试即可 12. 后续,需要改造后端
现在只是上传成功
还需要将上传好的图片地址存储到数据库,后续查询时查出地址,在前端展现
提示: 数据库存储图片地址时不要太长,可以只存储重要信息. 公共部分可以等从数据库查询出后再拼接展现给前端