Springboot图片上传及回显
程序员文章站
2022-03-27 20:32:16
...
问题
尝试了其他博客的文件上传，发现回显以及上传位置有些问题，这里自己尝试了一下。使用了thyemleaf做模板管理，可能和你的前端结构有些不同，但是关键代码还是可以参考的，希望能帮到你。
代码
控制器
这里是最关键的，要把文件放到你真正运行时的文件夹中，我放到了/static文件夹中，这个文件夹并不在你的工作目录中。
@Controller
@RequestMapping("/file")
public class FileController {
@RequestMapping("upload")
public String serverUpload(@RequestParam("file") MultipartFile file, Model model, HttpServletRequest req) throws FileNotFoundException {
// 获取上传文件名
String filename = file.getOriginalFilename();
// 将文件存储在运行环境的目录中
String serverpath = req.getSession().getServletContext().getRealPath("static/");
File filepath = new File(serverpath, filename);
// 判断路径是否存在，如果不存在就创建一个
if (!filepath.getParentFile().exists()) {
filepath.getParentFile().mkdirs();
}
try {
// 写入文件
file.transferTo(new File(serverpath + File.separator + filename));
} catch (IOException e) {
e.printStackTrace();
}
// 返回一个可以直接访问的地址，如http://localhost:8080/static/1.jpg
String serverFilePath = req.getScheme() + "://" + req.getServerName() + ":" + req.getServerPort() + "/static/" + filename;
model.addAttribute("filename", serverFilePath);
return "picture";
}
}
目录结构如下，这里只涉及了控制器，没有进行其他操作。
前端页面
这里就可以把文件上传到运行时的服务器的对应的文件夹中了。但是下次启动时，运行时的服务器的文件夹是空的，可以想办法解决。可以用FastDfs，也可以在启动时复制其他目录的文件。
每次用tomcat启动时，tomcat都会新建一个tomcat.doc文件夹。
<div class="container">
<body>
<div class="col-md-12">
<form action="/file/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file" accept="image/*">
<br>
<input type="submit" value="上传" class="btn btn-success">
</form>
[[${filename}]]
<br>
<img th:src="@{${filename}}" alt="图片">
<img th:src="@{/picture/4.jpg}"/>
</div>
</body>
</div>
上一篇： 模糊查询和聚合函数_MySQL
下一篇： 《数据库系统实现》读书笔记_MySQL