vue版pdf.js 在线预览pdf文件流

z793397795

已于 2022-04-30 13:15:00 修改

阅读量3.4k

点赞数

分类专栏：笔记文章标签： vue.js javascript 前端

于 2022-04-30 13:13:31 首次发布

本文链接：https://blog.csdn.net/z793397795/article/details/124510781

版权

1、简介

由于我使用的是若依版的vue前端框架(ElementUI二开)，因此不知道为什么在前端配置pdf.js一直无法生效，所以换了一个思路，将pdf.js相关文件放置在后台代码中，以访问后台页面的方式实现pdf预览。

2、pdf插件在后台代码的目录结构

我是把pdf.js文件放在了后台代码中，当然也可以使用nginx做代理，总之只要是第三方服务即可，前提是要处理好跨域问题。

3、后台获取文件流，与前端交互方法

	/**
	 * 根据fileInfoId获取文件流
	 */
	@GetMapping("/getPdfFileStream/{fileInfoId}")
	public void getPdfFileStream(HttpServletResponse response, @PathVariable String fileInfoId) throws IOException {
		if (StringUtils.isEmpty(fileInfoId)) {
			log.info("缺少关键参数：fileInfoId");
			return;
		}
		byte[] data = fileInfo.getPdfFileStream(fileInfoId);
		OutputStream outputStream = response.getOutputStream();
		outputStream.write(data);
		outputStream.flush();
		outputStream.close();
	}

核心方法：