本周三、周四、周五封装了一个基于SpringBoot的图片上传组件。功能流程如下:
1、前台页面有一个“选择文件”按钮,点击选择一张图片后,在前台界面进行显示。
2、双击显示出来的图片,前台使用cropper图片裁剪插件,将裁剪信息(裁剪起始点坐标 x,y,裁剪宽度width,裁剪高度height)以及上传的图片文件,传给后台。
3、后台对图片进行裁剪,再将裁剪后的图片进行压缩,把原图路径、裁剪后图片路径、压缩后图片路径、base64编码存入数据库。(同时后台将这三种图片保存到本地 D:/images/ 路径下)
4、后台将压缩后的图片路径传给前台。
5、前台接收到这个路径,在页面上进行显示。由于此时显示的是压缩的图片,如果用户想看原图(裁剪后图片的原图),点击该图片,携带这个图片路径请求后台接口。
6、后台接收到压缩图片路径,select数据库,找到裁剪后图片路径,返回给前台。
7、前台接收到这个原图片路径,在页面进行显示。
一、SpringBoot自定义静态资源映射
将一些动态维护的文件,放在服务器磁盘的某个目录下(项目目录之外),并且通过SpringBoot服务进行访问。
实现类继承WebMvcConfigurerAdapter并重写方法addResourceHandlers,将磁盘上文件存放的绝对路径映射,就可以通过访问SpringBoot服务来访问文件了。
@Configuration
public class WebAppConfig extends WebMvcConfigurerAdapter {
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/myImages/**").addResourceLocations("file:D:/images/");
super.addResourceHandlers(registry);
}
}
这样就将D盘上的images目录映射到myImages路径下,这个 myImages 是随意的一个命名。
假如在D盘images目录下有一个test.jpg图片,那么通过访问 http://localhost:8080/myImages/test.jpg 就可以访问到该图片了。
二、Java实现图片裁剪、使用Thumbnailator工具对图片进行压缩。
裁剪功能需要前台给后台传裁剪数据:x、y、width、