SpringBoot上传图片实现本地存储以及实现直接上传阿里云OSS

news/2024/10/4 2:08:21/

一、本地上传

概念:将前端上传的文件保存到自己的电脑

作用:前端上传的文件到后端后端存储的是一个临时文件,方法执行完毕会消失,把临时文件存储到本地硬盘中。

 1、导入文件上传的依赖

<dependency><groupId>commons-fileupload</groupId><artifactId>commons-fileupload</artifactId><version>1.3.1</version>
</dependency>
<dependency><groupId>commons-io</groupId><artifactId>commons-io</artifactId><version>2.4</version>
</dependency>

2、写一个上传文件的接口(注意:文件保存到本地需要写自己的本地路径)

@RestController
public class UploadController {@PostMapping("/content/link/upload")public ResponseResult upload(MultipartFile file, HttpServletRequest request) throws IOException {//本地上传的目的:将前端上传的文件转存到本地中,是因为前端上传的文件,后端存的是临时文件,方法运行完毕文件也会消失//获取上传文件的名字String filename=file.getOriginalFilename();//获取文件的扩展名String[] strings = filename.split("\\.");String kzName = strings[strings.length - 1];//随机的文件名UUID uuid = UUID.randomUUID();//把随机文件名和扩展名拼接String name=uuid+kzName;//本地文件名称如果不是XXX.jpg的话,需要改成String name=uuid+"."+kzName;//把临时文件存储到本地硬盘中file.transferTo(new File("自己的本地路径",name));return ResponseResult.okResult();}
}

3、前端作相应修改,保持请求一致(协议和端口不能丢)

4、启动项目即可实现,此时本地路径中就会出现上传的文件。

本地上传实现不了回显,需要用到阿里云的对象存储。

5、如果文件太大,需要在application.yml中设置上传的文件大小

servlet:multipart:#指定单个文件上传的大小max-file-size: 2MB#指定单次上传文件的大小max-request-size: 5MB

二、阿里云OSS

2.1 通过本地存储上传阿里云OSS

1、注册阿里云(实名认证)

2、开通对象存储OSS

2.1点击工作台,点击开始免费试用

2.2找到对象存储,点击立即试用

 2.3创建Bucket桶

 服务器位置可以任意选择,不过要跟后端endpoint对应上

 2.4Bucket创建完成

3、参照官方SDK入门

3.1找到SDK的说明

3.2找到文件上传参考部分 

3.2导入OSS依赖 (JDK9以下可直接复制该依赖)

<dependency><groupId>com.aliyun.oss</groupId><artifactId>aliyun-sdk-oss</artifactId><version>3.17.4</version>
</dependency> 

 如果使用的是Java 9及以上的版本,则需要添加JAXB相关依赖。添加JAXB相关依赖示例代码如下:

<dependency><groupId>javax.xml.bind</groupId><artifactId>jaxb-api</artifactId><version>2.3.1</version>
</dependency>
<dependency><groupId>javax.activation</groupId><artifactId>activation</artifactId><version>1.1.1</version>
</dependency>
<!-- no more than 2.3.3-->
<dependency><groupId>org.glassfish.jaxb</groupId><artifactId>jaxb-runtime</artifactId><version>2.3.3</version>
</dependency>

 3.3复制3.1部分上传文件流的代码,点击复制,到后端相应的包 粘贴 然后会自动粘贴,并生成一个名为Demo的类

4、获取AccessKey 

 没有的话创建AccessKey,即可生成accessKeyId和accessKeySecret。

5、运行Demo,并刷新阿里云,文件上传成功

 点击详情,复制文件的URL路径到前端,文件回显成功

2.2 文件直接上传阿里云OSS

1、封装一个AliOSSUtils类

java">@Component
public class AliOSSUtils {private String endpoint="https://oss-cn-hangzhou.aliyuncs.com";private String accessKeyId="LTAI5t6HZqg2bNixh5Hr5uqz";private String accessKeySecret="82qRssIfmQo05j0haZPleiitkQ6LID";private String bucketName="blog27";/** 实现上传图片到OSS*/public String upload(MultipartFile multipartFile) throws IOException {//获取上传的文件的输入流InputStream inputStream=multipartFile.getInputStream();//避免文件覆盖String fileName= LocalDateTime.now().format(DateTimeFormatter.ofPattern("yyyy-MM-dd-HH-mm-ss"))+multipartFile.getOriginalFilename();//上传文件到OSSOSS ossClient=new OSSClientBuilder().build(endpoint,accessKeyId,accessKeySecret);ossClient.putObject(bucketName,fileName,inputStream);//文件访问路径String url=endpoint.split("//")[0]+"//"+bucketName+"."+endpoint.split("//")[1]+"/"+fileName;//关闭ossClientossClient.shutdown();return url;}
}

2、编写一个上传文件的接口

3、前端作相应的修改(上传文件必须为POST请求,此处路径必须为接口全路径)

额外小知识:想让上传的图片URL地址直接返回到前端的文本框中,并回显成功,图中红框部分为文本框,用来回显图片的URL地址

1、在新增或修改的时候自动获取到阿里云图片的URL地址,后端添加接口

2、修改前端,添加一个上传成功的回调函数

上传成功后,将返回的URL设置到文本框中


http://www.ppmy.cn/news/1533470.html

相关文章

51单片机系列-串口(UART)通信技术

&#x1f308;个人主页&#xff1a; 羽晨同学 &#x1f4ab;个人格言:“成为自己未来的主人~” 并行通信和串行通信 并行方式 并行方式&#xff1a;数据的各位用多条数据线同时发送或者同时接收 并行通信特点&#xff1a;传送速度快&#xff0c;但因需要多根传输线&#xf…

EtherNET IP 转 Profinet 网关:工业通信的桥梁

在工业自动化领域&#xff0c;不同设备之间的通信协议兼容性是一个关键问题。EtherNET IP 和 Profinet 作为两种常用的工业以太网协议&#xff0c;各自在不同的设备和系统中广泛应用。而 EtherNET IP 转 Profinet 网关则成为了连接这两个不同协议世界的桥梁&#xff0c;发挥着至…

字体文件压缩

技术点 npm、html、font-spider 实现原理 个人理解&#xff1a;先引入原先字体&#xff0c;然后重置字符为空&#xff0c;根据你自己填充文字、字符等重新生成字体文件&#xff0c;因此在引入的时候务必添加自己使用的文字、字符等&#xff01;&#xff01;&#xff01; 实…

量化交易有什么优势,量化交易为何能成为投资“新宠”

炒股自动化&#xff1a;申请官方API接口&#xff0c;散户也可以 python炒股自动化&#xff08;0&#xff09;&#xff0c;申请券商API接口 python炒股自动化&#xff08;1&#xff09;&#xff0c;量化交易接口区别 Python炒股自动化&#xff08;2&#xff09;&#xff1a;获取…

时变电磁场(矢量除了是xyz还是t的函数)的麦克斯韦方程

静电场场的磁场方程与电荷守恒定律的矛盾的根本原因在于电荷守恒定律是时空的函数&#xff0c;静磁场的方程是特殊的空间的函数不含t&#xff0c;让其成为时空的函数就对应上了

【含文档】基于Springboot+Vue的果蔬种植销售一体化服务平台(含源码+数据库+lw)

1.开发环境 开发系统:Windows10/11 架构模式:MVC/前后端分离 JDK版本: Java JDK1.8 开发工具:IDEA 数据库版本: mysql5.7或8.0 数据库可视化工具: navicat 服务器: SpringBoot自带 apache tomcat 主要技术: Java,Springboot,mybatis,mysql,vue 2.视频演示地址 3.功能 系统定…

【Threejs进阶教程-着色器篇】8. Shadertoy如何使用到Threejs-基础版

【Threejs进阶教程-着色器篇】8. Shadertoy如何使用到Threejs - 基础版 前七篇地址,建议按顺序学习致谢带我入门的[X01动力装甲]大佬本文适用范围怎么样在Shadertoy中画出正圆形shadertoy中的坐标系比例转换理解Shadertoy的fragCoord理解Shadertoy中的iResolution 转移Shaderto…

Python 在Excel中创建、更新和删除数据透视表

目录 使用工具 Python 在 Excel 中创建数据透视表 Python 更改 Excel 数据透视表的数据源 Python 在 Excel 中为数据透视表字段设置数字格式 Python 在 Excel 中对数据透视表中的数据进行排序 Python 提取 Excel 中数据透视表的数据源 Python 从 Excel 中删除数据透视表…