上传文件是互联网中常常应用的场景之一，最典型的情况就是上传头像等，今天带大家做一个Spring Boot上传文件的小案例。
1、引入pom文件，上传文件需要用到spring-boot-starter-web依赖，由于在第一章都已添加，下面就不用重复添加了；
引入了spring-boot-starter-thymeleaf做页面模板引擎，写一些简单的上传示例。
2、在application.properties中添加以下内容：
#文件上传 #http://docs.spring.io/spring-boot/docs/current/reference/htmlsingle/#common-application-properties #默认支持文件上传. spring.servlet.multipart.enabled=true #支持文件写入磁盘. #spring.servlet.multipart.file-size-threshold= # 上传文件的临时目录 #spring.http.multipart.location= # 最大支持文件大小 spring.servlet.multipart.max-file-size=10MB # 最大支持请求大小 spring.servlet.multipart.max-request-size=10MB
3、在resources/templates下添加以下html文件。
upload.html：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--cdn提供的依赖--> <script src="https://cdn.bootcss.com/jquery/1.6.4/jquery.js"></script> <script type="text/javascript" src="https://cdn.bootcss.com/jquery.form/4.1.0/jquery.form.min.js"></script> </head> <body> <form id='myupload' action='/uploadFile' method='POST' enctype='multipart/form-data'> <div class="demo"> <div class="btn"> <span>添加附件</span> <input id="fileupload" type="file" name="file"></div> <div class="progress"> <span class="bar"></span> <span class="percent">0%</span></div> <!-- 显示已上传的文件名 --> <div class="files"></div> <!-- 显示已上传的图片--> <div class="showimg"></div> </div> <input type="submit" onclick="gosubmit2()" /> </form> <script type="text/javascript">var bar = $('.bar'); //进度条 var percent = $('.percent'); //获取上传百分比 var showimg = $('.showimg'); //显示图片的div var progress = $('.progress'); //显示进度的div var files = $('.files'); //文件上传控件的input元素 var btn = $('.btn span'); //按钮文本 function gosubmit2() { $("#myupload").ajaxSubmit({ dataType: 'json', //返回数据类型 beforeSend: function() { showimg.empty(); progress.show(); var percentVal = '0%'; bar.width(percentVal); percent.html(percentVal); btn.html('上传中..'); }, //更新进度条事件处理代码 uploadProgress: function(event, position, total, percentComplete) { var percentVal = percentComplete + '%'; bar.width(percentVal); percent.html(percentVal); }, success: function(data) { //图片上传成功时 //获取服务器端返回的文件数据 alert(data.name + "," + data.pic + "," + data.size); btn.html(上传成功+data.name + "," + data.pic + "," + data.size); }, error: function(xhr) { btn.html(上传失败); bar.width('0'); files.html(xhr.responseText); } }); } </script> </body> </html>
uploadStatus.html：
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <body> <h1>Spring Boot - Upload Status</h1> <div th:if="${message}"> <h2 th:text="${message}"/> </div> </body> </html>
4、在启动类中添加XczxApplication：
@Bean public TomcatServletWebServerFactory tomcatEmbedded() { TomcatServletWebServerFactory tomcat = new TomcatServletWebServerFactory(); tomcat.addConnectorCustomizers((TomcatConnectorCustomizer) connector -> { if ((connector.getProtocolHandler() instanceof AbstractHttp11Protocol<?>)) { ((AbstractHttp11Protocol<?>) connector.getProtocolHandler()).setMaxSwallowSize(-1); } }); return tomcat; }
tomcatEmbedded这段代码是为了解决，上传文件大于10M出现连接重置的问题。此异常内容GlobalException也捕获不到。
5、然后创建UploadController：
@Controller public class UploadController { private static final String UPLOADPATH = "D://FileShared//"; //请求进入upload.html页面 @RequestMapping("/upload") public String upload(){ return "upload"; } @RequestMapping("/uploadFile") public ModelAndView uploadFile(@RequestParam("file") MultipartFile file, ModelAndView modelAndView) { modelAndView.setViewName("uploadStatus"); if (file.isEmpty()) { modelAndView.addObject("message","上传失败，请选择一个文件上传"); return modelAndView; } try { byte[] bytes = file.getBytes(); Path path = Paths.get(UPLOADPATH + file.getOriginalFilename()); Files.write(path,bytes); modelAndView.addObject("message","上传成功，上传的文件名为：" + file.getOriginalFilename()); } catch (IOException e) { e.printStackTrace(); } return modelAndView; } }
上面代码的意思就是，通过MultipartFile读取文件信息，如果文件为空跳转到结果页并给出提示；如果不为空读取文件流并写入到指定目录，最后将结果展示到页面。
MultipartFile是Spring上传文件的封装类，包含了文件的二进制流和文件属性等信息，在配置文件中也可对相关属性进行配置，最常用的是最后两个配置内容，限制文件上传大小，上传时超过大小会抛出异常。
GlobalExceptionHandler：
@ControllerAdvice public class GlobalExceptionHandler { @ExceptionHandler(MultipartException.class) public String handleError1(MultipartException e, RedirectAttributes redirectAttributes) { redirectAttributes.addFlashAttribute("message", e.getCause().getMessage()); return "redirect:/uploadStatus"; } }
设置一个@ControllerAdvice用来监控Multipart上传的文件大小是否受限，当出现此异常时在前端页面给出提示。利用@ControllerAdvice可以做很多东西，比如全局的统一异常处理等，感兴趣的同学可以下来了解。
6、启动项目：
访问：http://localhost:8081/upload
上传失败：
上传成功：
