SpringBoot + Vue前后端分离图片上传到本地并前端访问图片
本文内容纲要:
-图片上传
-application.yml
-Controller
-前端访问图片
同理应该可用于其他文件
图片上传
application.yml
配置相关常量
prop:
upload-folder:E:/test/
#配置SpringMVC文件上传限制,默认1M。注意MB要大写,不然报错。SpringBoot版本不同,配置项不同
spring:
servlet:
multipart:
max-file-size:50MB
max-request-size:50MB
Controller
@Value("${prop.upload-folder}")
privateStringUPLOAD_FOLDER;
@PostMapping("/upload")
publicResultupload(@RequestParam(name="file",required=false)MultipartFilefile,HttpServletRequestrequest){
if(file==null){
returnResultUtil.error(0,"请选择要上传的图片");
}
if(file.getSize()>1024*1024*10){
returnResultUtil.error(0,"文件大小不能大于10M");
}
//获取文件后缀
Stringsuffix=file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf(".")+1,file.getOriginalFilename().length());
if(!"jpg,jpeg,gif,png".toUpperCase().contains(suffix.toUpperCase())){
returnResultUtil.error(0,"请选择jpg,jpeg,gif,png格式的图片");
}
StringsavePath=UPLOAD_FOLDER;
FilesavePathFile=newFile(savePath);
if(!savePathFile.exists()){
//若不存在该目录,则创建目录
savePathFile.mkdir();
}
//通过UUID生成唯一文件名
Stringfilename=UUID.randomUUID().toString().replaceAll("-","")+"."+suffix;
try{
//将文件保存指定目录
file.transferTo(newFile(savePath+filename));
}catch(Exceptione){
e.printStackTrace();
returnResultUtil.error(0,"保存文件异常");
}
//返回文件名称
returnResultUtil.success(ResultEnum.SUCCESS,filename,request);
}
前端访问图片
前端浏览器在http协议下因为安全原因无法直接访问本地文件
后端拦截器中配置对应url访问本地文件,若有相关拦截器则在拦截器中放行
@Configuration
publicclassMyInterceptorConfigextendsWebMvcConfigurationSupport{
@Value("${prop.upload-folder}")
privateStringUPLOAD_FOLDER;
@Autowired
privateJwtInterceptorjwtInterceptor;
@Override
protectedvoidaddInterceptors(InterceptorRegistryregistry){
registry.addInterceptor(jwtInterceptor)
.addPathPatterns("/**")
.excludePathPatterns("/login")
.excludePathPatterns("/img/**");
}
@Override
publicvoidaddResourceHandlers(ResourceHandlerRegistryregistry){
registry.addResourceHandler("/img/**").addResourceLocations("file:"+UPLOAD_FOLDER);
}
}
前端直接通过/img/图片名称
即可拿到
本文内容总结:图片上传,application.yml,Controller,前端访问图片,
原文链接:https://www.cnblogs.com/yxmhl/p/11972021.html