springboot文件上传,单文件上传和多文件上传,以及数据遍历和回显
springboot文件上传,单文件上传和多文件上传
- 项目结构及pom.xml
- 创建文件表单页面
- 编写javabean
- 编写controller映射
- MultipartFile类
- @RequestPart注解
- controller代码
- application.properties中的文件上传配置
- 遍历数据显示页面
- 运行显示
项目结构及pom.xml
pom.xml:
<dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId><scope>runtime</scope><optional>true</optional></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-configuration-processor</artifactId><optional>true</optional></dependency><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-test</artifactId><scope>test</scope></dependency></dependencies><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId><configuration><excludes><exclude><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId></exclude></excludes></configuration></plugin></plugins></build>
创建文件表单页面
文件表单要求其 form标签中method="post" enctype="multipart/form-data"
,然后多文件表单的话,可以通过<input type="file" multiple>
multiple属性来声明这是一个多文件控件。
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>文件表单上传</title>
</head>
<body><form th:action="@{/upload}" method="post" enctype="multipart/form-data">邮箱:<input type="text" name="email"><br>账号:<input type="text" name="idCard"><br>头像:<input type="file" name="head_portrait"><br>其他文件上传<input type="file" multiple name="fileLists"><br><input type="submit" value="上传"><br>
</form>
</body>
</html>
编写javabean
package com.robin.boot.bean;import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.ToString;import java.util.ArrayList;@ToString
@NoArgsConstructor
@AllArgsConstructor
@Data
public class MyFileUpLoad {// 封装javabean,用于success.html页面遍历数据private String email;private String idCard;private String headImg;private String[] names;
}
编写controller映射
MultipartFile类
在Spring框架中提供了MultipartFile来处理文件上传的文件。MultipartFile类是org.springframework.web.multipart
包下面的一个类,MultipartFile主要是用表单的形式进行文件上传,在接收到文件时,可以获取文件的相关属性,比如文件名、文件大小、文件类型等等。
MultipartFile类,提供了很多方法供我们使用,如下图:
@RequestPart注解
@RequestPart主要用来处理content-type为 multipart/form-data 或 multipart/mixed stream 发起的请求,可以获取请求中的参数,包括普通文本、文件或复杂对象比如json、xml等,针对json等复杂对象,需要明确对应的content-type。
使用时在@RequestPart(“xxx”),通过file表单控件的name值,即可获取对应元素的内容。
controller代码
获取上传的表单文件和普通控件的值,并将其存放于当前项目的静态资源下的uploadCaches文件夹中,同时如果上传成功的话,将上传的数据封装到javabean中,然后使用model将其发送至请求域中。
tip:这里图片上传的时候,封装到javabean中的是它的上传文件名,所以待会儿遍历时,使用img标签就可以看到上传的图片了。
使用MultipartFile类中提供的transferTo()方法可以直接将上传的文件保存到指定的位置中,getOriginalFilename()方法用于获取上传文件的文件名称。
package com.robin.boot.controller;import com.robin.boot.bean.MyFileUpLoad;
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RequestPart;
import org.springframework.web.multipart.MultipartFile;import java.io.File;
import java.io.IOException;
import java.util.ArrayList;@Slf4j
@Controller
public class FormTestController {// 获取文件上传表单@RequestMapping("/upload")public String upload(@RequestParam("email") String email,@RequestParam("idCard") String idCard,@RequestPart("head_portrait") MultipartFile head_portrait,@RequestPart("fileLists") MultipartFile[] fileLists,Model model) throws IOException {// 输出日志信息log.info("email{},idCard{},head_protrait_size{},fileLists_length{}",email,idCard,head_portrait.getSize(),fileLists.length);String headImg = "";// 保存上传的文件到当前项目的 static 目录下if(!head_portrait.isEmpty()){// 获取上传的头像的名字headImg = "uploadCaches\\"+head_portrait.getOriginalFilename();// 保存到 static目录中的 uploadCaches目录下head_portrait.transferTo(new File("D:\\IdeaProjects\\demoUpload\\src\\main\\resources\\static\\"+headImg));}// 多文件名数组String[] names = new String[fileLists.length];// 保存多文件。一边遍历一边保存if (fileLists.length>0){for (int i = 0; i < fileLists.length; i++) {if(!fileLists[i].isEmpty()){// 与上面单个文件保存的方法一样String filename = "uploadCaches\\"+fileLists[i].getOriginalFilename();names[i] = filename;fileLists[i].transferTo(new File("D:\\IdeaProjects\\demoUpload\\src\\main\\resources\\static\\"+filename));}}}// 创建javabean对象MyFileUpLoad myFileUpLoad = new MyFileUpLoad(email,idCard,headImg,names);// 跳转视图,并且封装数据到Model中model.addAttribute("msg","保存成功!");model.addAttribute("myFileUpLoad",myFileUpLoad);return "success";}
}
application.properties中的文件上传配置
可以通过spring.servlet.multipart.max-file-size
和spring.servlet.multipart.max-request-size
来设定服务器接受的文件上传的最大值。
spring.servlet.multipart.max-file-size=10MBspring.servlet.multipart.max-request-size=20MB
遍历数据显示页面
使用thymeleaf的 th:each
以及 th:text
和th:src
将请求域中的数据获取,并且渲染到页面中。需要注意的是,thymeleaf的for-each遍历item:${Lists}
其子项${item.xxx}...
,要求其中的item.xxx
,xxx必须是和javabean中的字段名对应,而不是和model发送请求时的字段名保持一致。
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>success</title>
</head>
<body><h3 th:text="${msg}">title</h3><div th:each="item:${myFileUpLoad}">邮箱:<span th:text="${item.email}">xxx</span><br>账号:<span th:text="${item.idCard}">xxx</span><br>头像:<img th:src="${item.headImg}"></img><br>其他文件:<p th:each="nameItem:${item.names}"><img th:src="${nameItem}" style="width: 240px;height: 240px"></img><br></p></div></body>
</html>
运行显示
springboot文件上传,单文件上传和多文件上传,以及数据遍历和回显相关推荐
- layui 文件上传(upload)实例重载及重新上传
layui 文件上传(upload)实例重载及重新上传 平时的话是真用不到这两个东西,咱先不考虑其他问题,直接看接口,是这样的:1,用户上传文件(这是个接口),上传完之后会返回上传的数据,进行回显,预 ...
- ElementUI图片上传 回显
html内容 <!-- 图片上传 --><el-row><el-col :span="24"><el-form-item label=&q ...
- 使用ajax提交图片,提交已经注入文件的表单给后台上传图片 使用ajaxsubmit
使用jquery form插件进行异步带文件的表单提交 引入form插件与jquery 的js文件后 获取表单的jq对象 然后.ajaxSubmit提交表单即可 实现添加品牌的异步表单提交 funct ...
- elementui 按钮 表单_前后端分离,文件上传下载(springBoot+vue+elementUI)
1.介绍 本文主要是介绍前后端分离的上传下载,后端使用的是SpringBoot,持久层用的是mybatis-plus,前端用的Vue,UI用的elementUI,测试了一下,文本,图片,excel,都 ...
- themyleaf 图片上传_javaEE --springboot #实现图片上传和回显 #单文件上传 #多文件上传 #ajax异步文件上传 (非常详细,从创建项目开始)...
实现文件上传和回显 1.新建一个SpringBoot项目,选择 Spring Web 和 thymeleaf 依赖 .pow.xml文件下的依赖如下 2.根据下图,创建如下文件 3.直接上代码 配置文 ...
- springboot并发上传文件_springboot实现单文件和多文件上传
本文实例为大家分享了springboot实现单文件/多文件上传的具体代码,供大家参考,具体内容如下 package com.heeexy.example.controller; import com. ...
- springboot调用python脚本_Springboot实现上传文件接口,使用python的requests进行组装报文上传文件的方法...
记录瞬间 近段时间使用Springboot实现了文件的上传服务,但是在使用python的requests进行post上传时,总是报错. 比如: 1.Current request is not a m ...
- 【SpringBoot】简单的文件上传和文件下载以及图片回显
介绍 这里是小编成长之路的历程,也是小编的学习之路.希望和各位大佬们一起成长! 以下为小编最喜欢的两句话: 要有最朴素的生活和最遥远的梦想,即使明天天寒地冻,山高水远,路远马亡. 一个人为什么要努力? ...
- java action 上传文件_Struts2实现单文件或多文件上传功能
一.简述 Struts2的文件上传其实也是通过拦截器来实现的,只是该拦截器定义为默认拦截器了,所以不用自己去手工配置, 二.指定用户上传文件的大小,有两种方式 1)默认是在default.proper ...
最新文章
- 记录 FreeBSD
- 【数据结构】图解霍夫曼编码,看了就能懂
- Node.js实践第一天
- 在春意盎然的季节里初识GIT
- Git for Windows 国内下载站
- [stl]集合相似度(PTA)
- python切片习题与详细讲解
- MyEclipse使用经验归纳
- 《刺猬的优雅》观后感
- drool 7.x 属性 : no-loop
- 黑盒测试方法(五)正交实验设计方法
- 雨落阅读量突破1000!
- 梆梆加固的病毒分析-破解篇
- 江南爱窗帘十大品牌 | 窗帘的定做有哪些技巧和注意事项?
- 『已解决』.NET报错:所生成项目的处理器框架“MSIL”与引用“wdapi_dotnet1021”的处理器架构“AMD64”不匹配
- javac 与 java的区别
- 新版标准日本语高级_第3课
- 【html+css3+js】 鼠标悬停控件改变鼠标样式
- 微信支付APP支付服务商模式
- 让Firefox像vim一样操作
热门文章
- java写适配器模式实例_java适配器模式实例
- 浅谈Android自定义锁屏页的发车姿势
- Camera2使用方法例子代码
- Bookmarks_2012_06_13
- SQLSTATE[42S02]: Base table or view not found: 1146 Table 'blog.user' doesn't exist (SQL: select * f
- 开源网安受邀参加2023澳门万讯论坛,引领软件安全领域国产化替代浪潮
- 你需要启用steam社区界面功能以进行购买_Steam游戏库界面大改!这也太帅了
- SOLIDWORKS Simulation h-自适应方法的应用
- 完美世界手游服务器维护时间表,完美世界手游开服表
- CIE RGB、CIE XYZ、 Lab空间转换