在项目中对已经保存的文件进行回显是经常需要做的,常用的是在后端将文件转为base64编码再传给前端,前端在展示文件的容器(比如最简单的img标签)的url里赋值传过来的base64码就可以回显文件。可当文件过多时,使用base64效率会非常慢,可考虑的一种方式是给前端容器的URL定义一个接口,通过流的方式来获取文件:
前端示例:
url: 'http://127.0.0.1:8089/restApi/read/' + file.fileId, // read接口 再加上文件存储id拼接
后端:
/**
* 文件回显
*/
@ApiOperation(value = "文件回显")
@ApiImplicitParam(value = "文件存储id", name = "fileId")
@GetMapping("read/{fileId}")
public void read(HttpServletResponse httpServletResponse,@PathVariable String fileId) {
OutputStream out = null;
InputStream in = null;
try {
//是让服务器告诉浏览器它发送的数据属于什么文件类型(图片/pdf/视频类型....)
httpServletResponse.setContentType("application/octet-stream");
//获取文件输入流,这里是通过统一存储获取的,不论是如何存储文件的,只要能获取到文件流都行
FileResult fileResult = dcsFileService.downloadDcs(fileId,accessKeyId,accessKeySecret,bucketId);
in = fileResult.getFileInputStream();
//拿到响应的输出流
out = httpServletResponse.getOutputStream();
//文件的输入流转换成输出流
IOUtils.copy(in, out);
//设置编码,防止乱码
httpServletResponse.setCharacterEncoding("UTF-8");
//设置响应消息头,设置文件名称
httpServletResponse.addHeader("content-disposition", String.format("inline;filename= %s", URLEncoder.encode(fileResult.getFileName(), "utf-8")));
out.flush();
} catch (Exception e) {
e.printStackTrace();
throw new AppException(e);
} finally {
//关闭输入输出流,防止流泄露
IOUtils.closeQuietly(in);
IOUtils.closeQuietly(out);
}
}
这就能实现文件的回显了
要思考的是,不是所有类型的文件都支持回显,所有在存储文件时建议将文件类型也存上(一般存文件名后缀),在做回显时可以根据类型来判断是否回显,不能回显的文件可以做一个下载功能,后端实现下载逻辑几乎和回显一样