江湖规矩先说结论:
两种方式解决
- 前端调用获取图片接口,后端从FTP服务器下载图片,将其转为Base64编码后的结果返回给前端,前端将返回结果置于img标签中的src属性中即可。(存在问题,图片比较大时,编码后的内容很长)
- 直接将下载图片的接口请求地址置于img标签中的src属性中,会自动调用接口,完成图片回显。
场景:不想在前端项目中配置ftp信息,但是通过调用后端接口的下载文件接口没法完成图片回显,而是直接下载图片了。
第二种解决方式:
后端接口处理:此处使用的是FTPClient获取FTP服务器上文件
private void outputFileToResponse(String filePath, HttpServletResponse resp, FTPClient ftpClient) {
try {
OutputStream out = resp.getOutputStream();
ftpClient.retrieveFile(filePath, out);
out.flush();
out.close();
} catch (IOException e) {
log.error("下载失败", e);
} finally {
log.debug("开始归还连接");
ftpPool.returnFTPClient(ftpClient);
}
}
注意点:不要给HttpServletResponse resp对象设置响应头和contentType,否则就成下载了
resp.setHeader("Content-Disposition", "attachment;filename=" + URLEncoder.encode(fileName, "utf-8"));
resp.setContentType("multipart/form-data");
前端处理:
<img src=”/xxx-api/xxx1/download?filePath=%2Fupload%2Ffiles1%2Fpicture%2F202104%2Fhongmeigui.png”/>
src属性中设置为接口路径即可,后面加上参数。一般项目中都有网关,在后面拼接&token=xxxxx即可