spring实现图片上传与读取

简介: spring实现图片上传与读取

• 上传文件

- 请求:必须是POST请求

- 表单:enctype=“multipart/form-data”

- Spring MVC:通过 MultipartFile 处理上传文件

• 开发步骤

-编写前端访问账号设置页面

上传页面


1.        <h6 class="text-left text-info border-bottom pb-2">上传头像</h6>
2.        <form class="mt-5" method="post" enctype="multipart/form-data" th:action="@{/user/upload}">
3.          <div class="form-group row mt-4">
4.            <label for="head-image" class="col-sm-2 col-form-label text-right">选择头像:</label>
5.            <div class="col-sm-10">
6.              <div class="custom-file">
7.                <input type="file" th:class="|custom-file-input ${error!=null?'is-invalid':''}|"
8.                     id="head-image" name="headerImage" lang="es" required="">
9.                <label class="custom-file-label" for="head-image" data-browse="文件">选择一张图片</label>
10.                 <div class="invalid-feedback" th:text="${error}">
11.                   该账号不存在!
12.                 </div>
13.               </div>
14.             </div>
15.           </div>
16.           <div class="form-group row mt-4">
17.             <div class="col-sm-2"></div>
18.             <div class="col-sm-10 text-center">
19.               <button type="submit" class="btn btn-info text-white form-control">立即上传</button>
20.             </div>
21.           </div>
22.         </form>

浏览页面

1.                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
2.                  <img th:src="${loginUser.headerUrl}" class="rounded-circle" style="width:30px;"/>
3.                </a>

- 上传头像接口

1. @LoginRequired
2. @RequestMapping(path = "/setting",method = RequestMethod.POST)
3. public String settingPassword(String oldPassword,String newPassword
4.             ,Model model,@CookieValue("ticket") String ticket){
5. User user = hostHodler.getUser();
6. if(user==null){
7. return "/site/login";
8.         }
9. if(user.getPassword().equals(CommunityUtil.md5(oldPassword+user.getSalt()))){
10.             userService.changePassword(user.getEmail(),newPassword);
11.             userService.logout(ticket);
12.             model.addAttribute("msg","修改密码成功,请尝试登陆");
13.             model.addAttribute("target","/login");
14. return "/site/operate-result";
15.         } else {
16.             model.addAttribute("passwordMsg","旧密码输入不正确");
17. return "/site/setting";
18.         }
19.     }
20. @LoginRequired
21. @RequestMapping(path = "/upload", method = RequestMethod.POST)
22. public String uploadHeader(MultipartFile headerImage, Model model) {
23. if (headerImage == null) {
24.             model.addAttribute("error", "您还没有选择图片!");
25. return "/site/setting";
26.         }
27. 
28. String fileName = headerImage.getOriginalFilename();
29. String suffix = fileName.substring(fileName.lastIndexOf("."));
30. if (StringUtils.isBlank(suffix)) {
31.             model.addAttribute("error", "文件的格式不正确!");
32. return "/site/setting";
33.         }
34. 
35. // 生成随机文件名
36.         fileName = CommunityUtil.generateUUID() + suffix;
37. // 确定文件存放的路径
38. File dest = new File(uploadPath + "/" + fileName);
39. try {
40. // 存储文件
41.             headerImage.transferTo(dest);
42.         } catch (IOException e) {
43.             logger.error("上传文件失败: " + e.getMessage());
44. throw new RuntimeException("上传文件失败,服务器发生异常!", e);
45.         }
46. 
47. // 更新当前用户的头像的路径(web访问路径)
48. // http://localhost:8080/community/user/header/xxx.png
49. User user = hostHolder.getUser();
50. String headerUrl = domain + contextPath + "/user/header/" + fileName;
51.         userService.updateHeader(user.getId(), headerUrl);
52. 
53. return "redirect:/index";
54.     }

- 获取头像接口

1. @RequestMapping(path = "/header/{fileName}", method = RequestMethod.GET)
2. public void getHeader(@PathVariable("fileName") String fileName, HttpServletResponse response)  {
3. // 服务器存放路径
4.         fileName = uploadPath + "/" + fileName;
5. // 文件后缀
6. String suffix = fileName.substring(fileName.lastIndexOf("."));
7. // 响应图片
8.         response.setContentType("image/" + suffix);
9. try (
10. FileInputStream fis = new FileInputStream(fileName);
11. OutputStream os = response.getOutputStream();
12.         ) {
13. byte[] buffer = new byte[1024];
14. int b = 0;
15. while ((b = fis.read(buffer)) != -1) {
16.                 os.write(buffer, 0, b);
17.             }
18.         } catch (IOException e) {
19.             logger.error("读取头像失败: " + e.getMessage());
20.         }
21.     }

源代码地址:

牛客论坛: 牛客论坛

目录
相关文章
|
存储 Java API
如何在Spring Boot应用程序中使用华为云的OBS云存储来上传和删除图片?
如何在Spring Boot应用程序中使用华为云的OBS云存储来上传和删除图片?
637 1
|
前端开发 Java Spring
Spring Boot 实现图片上传并回显
Spring Boot 实现图片上传并回显
|
机器学习/深度学习 文字识别 前端开发
基于 Spring Boot 3.3 + OCR 实现图片转文字功能
【8月更文挑战第30天】在当今数字化信息时代,图像中的文字信息越来越重要。无论是文档扫描、名片识别,还是车辆牌照识别,OCR(Optical Character Recognition,光学字符识别)技术都发挥着关键作用。本文将围绕如何使用Spring Boot 3.3结合OCR技术,实现图片转文字的功能,分享工作学习中的技术干货。
1206 2
|
Java Spring
Spring boot +Thymeleaf 本地图片加载失败(图片路径)的问题及解决方法
这篇文章详细讲解了在Spring Boot应用程序中本地图片无法加载的问题原因,并提供了两个示例来说明如何通过使用正确的相对路径或Thymeleaf语法来解决图片路径问题。
|
前端开发 JavaScript Java
Spring boot 本地图片不能加载(图片路径)的问题及解决方法
这篇文章讨论了Spring Boot应用程序中本地图片无法加载的问题,通常由图片路径不正确引起,并提供了使用正确的相对路径和Thymeleaf语法来解决这一问题的两种方法。
|
缓存 Java Apache
Spring一行代码搞定图片url地址转换为Base64,超简单!!!!
这段内容讲述了如何将URL指向的图片转换为Base64字符串。首先通过`org.apache.commons.io.IOUtils`或Java标准库读取URL的字节流,然后用Java 8的`Base64`类编码。示例代码提供了两种实现方式:一种依赖Apache Commons IO,另一种仅使用Java内置类。在第二种方式中,自定义了`toByteArray()`方法处理输入流并转换为字节数组,最后关闭输入流释放资源。
|
消息中间件 编解码 JavaScript
Spring 多线程异步上传图片、处理水印、缩略图
Spring 多线程异步上传图片、处理水印、缩略图
|
前端开发 Java Maven
如何在Spring MVC中实现图片的上传和下载功能
如何在Spring MVC中实现图片的上传和下载功能
|
XML JSON Java
图文并茂:解析Spring Boot Controller返回图片的三种方式
图文并茂:解析Spring Boot Controller返回图片的三种方式
1349 0
|
前端开发 Java Spring
Spring Boot 实现图片上传并回显
Spring Boot 实现图片上传并回显
858 0