1.前言
1.1场景描述:
最近项目中新增了一个功能,即图片或者视频的在线预览。图片或者视频存放在专门的服务器上面(Windows服务器),假设存储路径为C:\upload\data\picture\ 该路径下面存储的是所有需预览的图片.
1.2 开发步骤
1.2.1 模拟创建实体类表
// 检测数据
public Class CheckData {
// 检测数据名称
private String name;
// 文件路径(c:\upload\data\picture\1.png)
private String filePath;
}
1.2.2 添加配置类
@Configuration
public class FileConfig implements WebMvcConfigurer {
@Value("${file.config.diskPath}")
// 文件本地路径 c:\
private String diskPath;
@Value("${file.config.pathPattern}")
// /file/**
private String pathPattern;
public FileConfig(){
}
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
// addResourceHandler-浏览器请求路径;addResourceLocations-文件存放的真实路径(比如C盘)
registry.addResourceHandler(pathPattern).addResourceLocations("file:"+ diskPath);
}
}
该配置文件的作用就是将URL地址中file路径替换为C盘路径-建立file与C的映射。
1.2.3 构造返回给前端的数据
@GetMapping("/getCheckData")
public List<CheckData> getCheckData() {
// 假设此为从数据库中查询出来的数据
List<CheckData> checkDataList = new ArrayList<>();
// 因为数据库中filePath存储的是本地路径
for (CheckData checkData : checkDataList) {
// ipAddress为当前服务部署的Ip地址
// replace方法:将localPath中包含C:\的部分替换为空字符串
// urlPath:/file/ ; 可在配置文件中定义
String localPath = "c:\upload\data\picture\1.png";
String filePath = "http://" + ipAddress + urlPath + StringUtils.replace(checkData.getFilePath(), "c:\", "");
checkData.setPath(filePath);
// 这样当用户访问http://192.168.50.2/file/upload/data/picture/1.png时,通过配置类,自动将file映射为C盘。
}
return checkDataList;
}
1.2.4 通过IO流的方式将图片或者视频返回给前端
此种方法适用于纯图片情况,如果存在较大的视频,则响应时间较长。此处不在细说。