筆記70 Spring Boot快速入門（八）（重要）

時間 2019-11-18

原文原文鏈接

上傳文件html

1、方式一java

1.上傳頁面git

upLoadPage.htmlgithub

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8"/>
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 <h1>Thymeleaf</h1>
 9     <form action="upload" method="post" enctype="multipart/form-data">
10         選擇圖片：<input type="file" name="file" accept="image/*"/><br/>
11         <input type="submit" value="上傳"/>
12     </form>
13 </body>
14 </html>

<1>. method="post" 是必須的
<2>. enctype="multipart/form-data" 是必須的，表示提交二進制文件
<3>. name="file" 是必須的，和後續服務端對應
<4>. accept="image/*" 表示只選擇圖片web

2.上傳文件頁面跳轉控制器，用來跳轉到上傳頁面。spring

1     @RequestMapping("upLoadPage")
2     public String uploadPage(){
3         return "upLoadPage";
4     }

3.上傳文件控制器，用來上傳文件，並跳轉到顯示頁面。apache

 1     @RequestMapping(value = "/upload",method = RequestMethod.POST)
 2     public String upload(HttpServletRequest request, @RequestParam("file")MultipartFile file, Model model){
 3 
 4         try {
 5             String fileName=System.currentTimeMillis()+file.getOriginalFilename();
 6             String destFileName=request.getServletContext().getRealPath("")+"uploaded"+File.separator+fileName;
 7             File destFile=new File(destFileName);
 8             destFile.getParentFile().mkdirs();
 9             file.transferTo(destFile);
10             //System.out.println(destFileName);
11             model.addAttribute("fileName",fileName);
12         }catch (FileNotFoundException e){
13             e.printStackTrace();
14             return "上傳失敗,"+e.getMessage();
15         }catch (IOException e){
16             e.printStackTrace();
17             return "上傳失敗,"+e.getMessage();
18         }
19         return "showImage";
20     }

<1>. 接受上傳的文件api

@RequestParam("file") MultipartFile file

<2>. 根據時間戳建立新的文件名，這樣即使是第二次上傳相同名稱的文件，也不會把第一次的文件覆蓋了瀏覽器

String fileName = System.currentTimeMillis()+file.getOriginalFilename();

<3>. 經過req.getServletContext().getRealPath("") 獲取當前項目的真實路徑，而後拼接前面的文件名tomcat

String destFileName=req.getServletContext().getRealPath("")+"uploaded"+File.separator+fileName;

<4>. 第一次運行的時候，這個文件所在的目錄每每是不存在的，這裏須要建立一下目錄

File destFile = new File(destFileName);

destFile.getParentFile().mkdirs();

<5>. 把瀏覽器上傳的文件複製到但願的位置

file.transferTo(destFile);

<6>. 把文件名放在model裏，以便後續顯示用

model.addAttribute("fileName",fileName);

4.顯示頁面

showImage.html

 1 <!DOCTYPE html>
 2 <html lang="en" xmlns:th="http://www.thymeleaf.org">
 3 <head>
 4     <meta charset="UTF-8"/>
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <img th:src="@{/uploaded/{filename}(filename=${fileName})}"/>
 9 </body>
10 </html>

5.application.properties

1 #spring.mvc.view.prefix=/WEB-INF/jsp/
2 #spring.mvc.view.suffix=.jsp
3 spring.http.multipart.max-file-size=10MB
4 spring.http.multipart.max-request-size=10MB
5 
6 spring.thymeleaf.enabled=true
7 
8 server.port=5050

設置上傳文件的大小，默認是1m,過小了，文件稍微大一點就會出錯。修改端口，啓用thymeleaf模板

6.測試

文件的存儲路徑：

2、方式二（將文件保存在項目目錄下）

1.在pom.xml增長依賴，使項目支持JSP。

 1         <!-- servlet依賴. -->
 2         <dependency>
 3             <groupId>javax.servlet</groupId>
 4             <artifactId>javax.servlet-api</artifactId>
 5 
 6         </dependency>
 7         <dependency>
 8             <groupId>javax.servlet</groupId>
 9             <artifactId>jstl</artifactId>
10         </dependency>
11         <dependency>
12             <groupId>org.apache.tomcat.embed</groupId>
13             <artifactId>tomcat-embed-jasper</artifactId>
14         </dependency>

2.在main目錄下，新建-> webapp/WEB-INF/jsp 目錄，用來存放視圖。webapp存放視圖和資源（上傳的文件）

3.showImage.jsp、upLoadPage.jsp中的內容直接把html中的複製過來便可。

1 <%@ page language="java" contentType="text/html; charset=UTF-8"
2     pageEncoding="UTF-8"%>
3     
4 <img src="/uploaded/${fileName}">

4.application.properties中添加對jsp視圖的解析路徑，並將thymeleaf模板關閉。

1 spring.mvc.view.prefix=/WEB-INF/jsp/
2 spring.mvc.view.suffix=.jsp
4.spring.thymeleaf.enabled=false

5.測試

上傳文件所在位置：

代碼：https://github.com/lyj8330328/springboot-upload-demo

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。