图片配置虚拟路径

1. 前言

• 为什么配置虚拟路径
  • 当我们需要上传图片至服务器上时，在数据库里存入图片的base64显然不是个好的方法。那么我们可以存入物理路径或者虚拟路径
  • 如果采用物理路径，很有可能出现项目上线之后，图片获取不到的情况。并且，当系统升级，需要全量更新时，就需要拷贝所有资源进行更新，这就会很麻烦。
  • 而如果采用虚拟路径，我们就可以通过URL来获取图片
    • url=“http://你自己的域名/项目名/images/”+fileName;

2. 配置

• 一般来说可以在配置文件中配置，但如果你是用的是现成的框架，上线是能上项目模块的jar包，是无法更改配置文件的。那么你就可以写一个配置类。

import org.springframework.beans.factory.annotation.Value;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
/**
 * 新增静态资源路径,与默认不冲突,解决图片需要虚拟路径问题
 * @author chencf
 *
 */
@Configuration
public class MyWebAppConfigurer
        implements WebMvcConfigurer {
    @Value("file:/D:/fileUpload/")
    private String imagesPath;//图片地址

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        System.out.println("文件路径=="+imagesPath);
        registry.addResourceHandler("/images/**").addResourceLocations(imagesPath);
    }
}

• 这样，当你上传文件的时候就会将文件存储在D盘的fileUpload文件夹中，可以通过url（http://自己域名/images/文件名.图片类型）访问到图片。

3. 文件上传

后端代码：

public Sspfy uploadFile( MultipartFile file,Sspfy sspfy) {
		String url;

		System.out.print("上传文件==="+"\n");

		// 获取文件名
		String fileName = file.getOriginalFilename();
		System.out.print("上传的文件名为: "+fileName+"\n");

		//获得文件类型
		String contentType=file.getContentType();

		fileName =UUID.randomUUID().toString().replace("-", "")+ fileName.substring(fileName.lastIndexOf('.'));
		System.out.print("保存的文件名为: "+fileName+"\n");

		String path = "D:/fileUpload/" +fileName;
		//文件绝对路径
		System.out.print("保存文件绝对路径"+path+"\n");

		//创建文件路径
		File dest = new File(path);

		//判断文件父目录是否存在
		if (!dest.getParentFile().exists()) {
			dest.getParentFile().mkdir();
		}

		//上传文件
		try {
			file.transferTo(dest); //保存文件
			System.out.print("保存文件路径"+path+"\n");
			url="http://localhost:8085/images/"+fileName;//本地运行项目

			sspfy.setName(fileName);
			sspfy.setPath(path);
			sspfy.setHousePhoto(url);
		} catch (IOException e) {
			e.printStackTrace();
		}
		return sspfy;
	}

前端代码：

<div class="col-sm-10">
	<a href="${sspfy.housePhoto!}" target="_blank"><img src="${sspfy.housePhoto!}" width="600"/></a>
</div>