我正在关注一本有很多错别字/错误的书的教程。当作者犯错时,我可以通过检查和修复显而易见的东西来跟上它。
目前我被困住了。我有一个上传图像文件的表单,当页面重新加载(上传后)时,图像应该显示在表单上方(上传前的空白图像)。 img
src
属性是在上传后生成的,由Thymleaf和控制器中的URL(/ uploadedPicture)处理,但似乎我的代码在某个地方出错了,因为它没有w。我想继续这本有点好的书。
另外,我不确定我是否导入了正确的Path
,因为有一些可用,并且该书没有像其他章节那样指定。< /强>
注意:上传图片后,当我在Chrome控制台上查看/uploadedPicture
时,会在此消息中出现500
错误:
{
"timestamp":1454561252135,
"status":500,
"error":"Internal Server Error",
"exception":"org.springframework.beans.ConversionNotSupportedException",
"message":"Failed to convert value of type [org.springframework.core.io.FileSystemResource] to required type [java.nio.file.Path]; nested exception is java.lang.IllegalStateException: Cannot convert value of type [org.springframework.core.io.FileSystemResource] to required type [java.nio.file.Path]: no matching editors or conversion strategy found",
"path":"/uploadedPicture"
}
PictureUploadController.java
package masterSpringMvc.profile;
import masterSpringMvc.config.PictureUploadProperties;
import org.apache.tomcat.util.http.fileupload.IOUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.core.io.FileSystemResource;
import org.springframework.core.io.Resource;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.SessionAttributes;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.servlet.mvc.support.RedirectAttributes;
import javax.servlet.http.HttpServletResponse;
import java.io.*;
import java.net.URLConnection;
import java.nio.file.Path;
@Controller
@SessionAttributes("picturePath")
public class PictureUploadController {
private final Resource picturesDir;
private final Resource anonymousPicture;
@Autowired
public PictureUploadController(PictureUploadProperties uploadProperties) {
picturesDir = uploadProperties.getUploadPath();
anonymousPicture = uploadProperties.getAnonymousPicture();
}
@ModelAttribute("picturePath")
public Resource picturePath() {
return anonymousPicture;
}
@RequestMapping("/upload")
public String uploadPage() {
return "profile/uploadPage";
}
@RequestMapping(value = "/upload", method = RequestMethod.POST)
public String onUpload(MultipartFile file,
RedirectAttributes redirectAttributes,
Model model) throws IOException {
if (file.isEmpty() || !isImage(file)) {
redirectAttributes.addFlashAttribute("error",
"Incorrect file. Please upload a picture.");
return "redirect:/upload";
}
Resource picturePath = copyFileToPictures(file);
model.addAttribute("picturePath", picturePath);
return "profile/uploadPage";
}
@RequestMapping(value = "/uploadedPicture")
public void getUploadedPicture(HttpServletResponse response,
@ModelAttribute("picturePath") Path picturePath)
throws IOException {
response.setHeader("Content-Type", URLConnection
.guessContentTypeFromName(picturePath.toString()));
IOUtils.copy(anonymousPicture.getInputStream(), response.getOutputStream());
}
private Resource copyFileToPictures(MultipartFile file) throws IOException {
String fileExtension = getFileExtension(file.getOriginalFilename());
File tempFile = File.createTempFile("pic", fileExtension,
picturesDir.getFile());
try (InputStream in = file.getInputStream();
OutputStream out = new FileOutputStream(tempFile)) {
IOUtils.copy(in, out);
}
return new FileSystemResource(tempFile);
}
private boolean isImage(MultipartFile file) {
return file.getContentType().startsWith("image");
}
private static String getFileExtension(String name) {
return name.substring(name.lastIndexOf("."));
}
}
uploadPage.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
layout:decorator="layout/default">
<head lang="en">
<title>Profile Picture Upload</title>
</head>
<body>
<div class="row" layout:fragment="content">
<h2 class="indigo-text center">Upload</h2>
<div class="col s12 center red-text" th:text="${error}" th:if="${error}">
Error during upload
</div>
<div class="col m8 s12 offset-m2">
<img th:src="@{/uploadedPicture}" width="100" height="100"/>
</div>
<form th:action="@{/upload}" method="post" enctype="multipart/form-data" class="col m8 s12 offset-m2">
<div class="input-field col s6">
<input type="file" id="file" name="file"/>
</div>
<div class="col s6 center">
<button class="btn indigo waves-effect waves-light" type="submit" name="save" th:text="#{submit}">
Submit<i class="mdi-content-send right"></i>
</button>
</div>
</form>
</div>
</body>
</html>
答案 0 :(得分:2)
按以下方式注入Resource
而不是Path
:
@RequestMapping(value = "/uploadedPicture")
public void getUploadedPicture(HttpServletResponse response, @ModelAttribute("picturePath") Resource picturePath) throws IOException {
response.setHeader("Content-Type", URLConnection.guessContentTypeFromName(picturePath.toString()));
Path path = Paths.get(picturePath.getURI());
Files.copy(path, response.getOutputStream());
}