springboot 资源文件映射问题

1、需求来源

    图片的上传后并显示在页面

2、技术基础

使用springboot，此处楼主使用1.5.10.RELEASE。（2.0版本也行，已测）

3、思路方案

1）文件存的基本思路

楼主上传的文件放在F盘的某个目录下，数据库存的是某目录下的文件路径，此处可看做是图片路径。即F:\logs\platLogo\1552294228766.png,图片存的绝对路径。

2）文件取的基本思路

项目部署后，我们不知道项目具体的文件存放位置，也不能使用绝对路径来获取文件，这里就难住了我。于是楼主就想，怎么将绝对路径转化为相对路径，通过项目访问就可以获取文件。

4、解决措施

查看资料，发现springboot可以配置文件的映射。如下面代码：

@Configuration
public class WebMvcConfg extends WebMvcConfigurerAdapter  {

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/web/**").addResourceLocations("file:F:/logs");
        super.addResourceHandlers(registry);
    }

}

简单说明："file:F:/logs" 表示本地文件的路径，"/web/**"表示项目访问的路径，即http://localhost:8900/web/ 。如我要访问本地的文件，在浏览器上输入：F:\logs\platLogo\1552294228766.png，就可以访问。通过springboot文件映射后，可以这样访问:http://localhost:8900/web/platLogo/1552294228766.png.这样我们就可以在页面显示图片。

5、代码共享

1）向前端返回实体

@ApiOperation(value="获取平台信息/播放插件版本号")
	@GetMapping(value = "/getPlatMsg")
    @ApiImplicitParam(name = "type", value = "类型:2 表示 播放插件,3 表示logo", required = true)
	public ApiResponse<SysconfigPlugVo> getPlatMsg(String type) {
	    if (StrUtil.isBlank(type)){
	        return new ApiResponse<SysconfigPlugVo>().error("类型不能为空");
        }
        SysconfigPlugVo item = sysconfigPlugService.getDownloadParam(type);
		if (item != null && StrUtil.isBlank(item.getPath())){
			return new ApiResponse().error("请上传logo图片");
		}
		return new ApiResponse().ok().setData(item);
	}

2）前端展示

前端使用的vue, 这里的api是前端配置访问后端的接口的ip+端口，web是映射的路径

 getPlatformMsg(){
      this.$ajax.get(`/api/sysconfigParam/getPlatMsg`, {'params': {type: 3}}).then(res => {
        if (res.data.code === this.hdConst.OK) {
          let param = res.data.data
          let imgUrl = '/api/web/'+param.path
          let imgName = param.name
        }
      })
    },

 

6、心得

    此处的关键是文件路径的映射，映射环境配置好了，返回路径到前端，前端可以根据路径实现图片的显示或者文件的下载。小小例子，记录一下。

 

7、项目地址（多种图片显示总结）

https://github.com/krycai/Allen-projects/tree/master/allen-upload