使用 Spring Boot 和 Thymeleaf 上傳圖像
一、概述
在本快速教程中，我們將了解如何使用 Spring Boot 和 Thymeleaf 在 Java Web 應用程序中上傳圖像。
2. 依賴
我們只需要兩個依賴項——Spring Boot web 和 Thymeleaf：
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>3. Spring Boot 控制器
我們的第一步是創建一個 Spring Boot Web 控制器來處理我們的請求：
@Controller public class UploadController {
public static String UPLOAD_DIRECTORY = System.getProperty("user.dir") + "/uploads";
@GetMapping("/uploadimage") public String displayUploadForm() {
return "imageupload/index";
}
@PostMapping("/upload") public String uploadImage(Model model, @RequestParam("image") MultipartFile file) throws IOException {
StringBuilder fileNames = new StringBuilder();
Path fileNameAndPath = Paths.get(UPLOAD_DIRECTORY, file.getOriginalFilename());
fileNames.append(file.getOriginalFilename());
Files.write(fileNameAndPath, file.getBytes());
model.addAttribute("msg", "Uploaded images: " + fileNames.toString());
return "imageupload/index";
}
}我們已經定義了兩種方法來處理 HTTP GET 請求。 displayUploadForm()方法處理 GET 請求並返回 Thymeleaf 模板的名稱以顯示給用戶，以便讓他導入圖像。
uploadImage()方法處理圖像上傳。它在圖像上傳時接受multipart/form-data POST 請求，並將圖像保存在本地文件系統上。 MultipartFile接口是 Spring Boot 提供的一種特殊數據結構，用於表示多部分請求中上傳的文件。
最後，我們創建了一個上傳文件夾來存儲所有上傳的圖片。我們還添加了一條消息，其中包含上傳圖像的名稱，以在用戶提交表單後顯示。
4.百里香模板
第二步是創建一個 Thymeleaf 模板，我們將在路徑src/main/resources/templates中調用index.html 。此模板顯示一個 HTML 表單以允許用戶選擇和上傳圖像。此外，我們使用accept=”image/*”屬性來允許用戶只導入圖像而不是導入任何類型的文件。
讓我們看看我們的index.html文件的結構：
<body>
<section class="my-5">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto">
<h2>Upload Image Example</h2>
<p th:text="${message}" th:if="${message ne null}" class="alert alert-primary"></p>
<form method="post" th:action="@{/upload}" enctype="multipart/form-data">
<div class="form-group">
<input type="file" name="image" accept="image/*" class="form-control-file">
</div>
<button type="submit" class="btn btn-primary">Upload image</button>
</form>
<span th:if="${msg != null}" th:text="${msg}"></span>
</div>
</div>
</div>
</section>
</body>5 .自定義文件大小
如果我們嘗試上傳大文件，則會拋出MaxUploadSizeExceededException異常。但是，我們可以通過我們在application.properties文件中定義的屬性spring.servlet.multipart.max-file-size和spring.servlet.multipart.max-request-size來調整文件上傳限制：
spring.servlet.multipart.max-file-size = 5MB
spring.servlet.multipart.max-request-size = 5MB6 .結論
在這篇快速文章中，我們介紹瞭如何在基於 Spring Boot 和 Thymeleaf 的 Java Web 應用程序中上傳圖像。
與往常一樣，本文的完整源代碼可以在 GitHub 上找到。