PDF.js是为html5实现的在线预览pdf框架，所以你的浏览器要支持html5才能使用这个框架。

pdf.js使用步骤

一. 到官网下载 pdf.js 插件并解压 (地址: http://mozilla.github.io/pdf.js/ )

1: 进入官网

2 : 选择稳定版下载

3: 下载至本地

4 : 解压

5:将解压后的文件夹重命名为generic拷贝到tomcat的webapps文件夹下：

然后启动tomcat,输入以下网址测试：

http://localhost:8080/generic/web/viewer.html

这时就会出现一个酷酷的界面：

generic/web/viewer.html主要是渲染阅读器的样式，而generic/web/viewer.js可以指定默认打开的文件（当然还有其他功能），打开viewer.js,找到下面一段代码：

defaultUrl: {value: 'compressed.tracemonkey-pldi-09.pdf',kind: OptionKind.VIEWER}

这里指定默认的pdf，要想打开指定的pdf文件，可以在http://localhost:8080/generic/web/viewer.html后面加上file参数。例如打开下面的test.pdf：

就可以使用

http://localhost:8080/generic/web/viewer.html?file=test.pdf

来打开

以上使用file传参是比较简单的方式,只要知道了文件名跟类型就行了。但是这种方式用在项目中的话只能打开项目里的pdf文件，换句话说就是PDF.js默认是不能打开项目外文件系统的文件，这时就需要自己写控制器来下载pdf文件。

控制器示例（基于spring boot框架）：

/*** 预览pdf文件* @author Mike* @param request* @param response* @param fileName*/@RequestMapping(value = "/downloadPdf", method = RequestMethod.GET)public void pdfStreamHandeler(HttpServletRequest request, HttpServletResponse response,String fileName) {String filePath = "D:/upload/supervision/" + fileName;
//        System.out.println(fileName);File file = new File(filePath);byte[] data = null;try {FileInputStream input = new FileInputStream(file);data = new byte[input.available()];input.read(data);response.getOutputStream().write(data);input.close();} catch (Exception e) {System.out.print("pdf文件处理异常：" + e.getMessage());}}

其中fileName要包括文件后缀名。下面是前台调用控制器的示例：

window.location.href = "/pdfjs/web/viewer.html?file=" + encodeURIComponent("/downloadPdf?fileName=" + number + "." + type);

由于一个url中不能出现两个？号，所以需要用到js中的encodeURIComponent()来进行编码，然后viewer.js里会自动对编码的内容进行解码，函数如下：

WebApp打开服务器端pdf文件相关推荐

LabVIEW如何打开Acrobat PDF文件
LabVIEW如何打开Acrobat PDF文件如何能够在LabVIEW的VI中打开一个Acrobat Reader的文档? 解答: 在LabVIEW中打开一个PDF文件最大的困难就是寻找一种可靠的 ...
android中打开查看pdf文件可用mupdf
项目中用到过mupdf第三方库来开发android应用直接打开pdf文件的功能,为了更多的了解mupdf库上网找资料发现一篇个人文章写的还不错,拿来记录一下: 一时兴起因为自己前段时间一直在做故事会 ...
打开含有pdf文件的文件夹电脑一直闪烁解决方案
PDF 引起的异常苦苦找了一晚上背景:电脑好好地的突然出现打开文件夹显示正在处理,然后卡顿闪退找了网上好多方法都不行,最后发现是PDF文件引起的: 有PDF的文件夹全部是这种情况另外 ...
福昕阅读器多窗口/标签打开同一个pdf文件
一.多实例窗口点击文件-左侧栏偏好设置,在文档选项中勾选**"多实例"选项**,确定后再打开同一个pdf即可在多个福昕阅读器浏览二.单标签多视图窗口点击视图-页面显示,第三 ...
js打开服务器pdf文件,iOS使用pdf.js打开PDF文件
最近研究了下iOS打开PDF文件的方式,由于项目需要在浏览PDF文件时能使用HTML格式文件,调研了一下iOS中打开PDF文件的几种方式,发现pdf.js开源库可以做到这一点,通过调用js在线预览PD ...
微信小程序---下载、打开及预览PDF文件的方法
微信小程序的常用功能:打开PDF格式的文档.小程序的官方API是 wx.downloadFile.wx.openDocument(点击可以直接跳转到官方文档的解释) 详细用法请看Demo: //下载P ...
为什么pdf文件在一个计算机上能打开,拷贝到别的计算机上就打不开,显示文件已损坏?,pdf文件在电脑上打不开怎么办...
电脑安装有pdf文件阅读器,但是就是打不开pdf文件.下面由学习啦小编为你整理了pdf文件在电脑上打不开怎么办的相关方法,希望对你有帮助! pdf文件电脑打不开解决方法如下 1在电脑上双击一个pdf文 ...
用电脑怎么打开pdf文件阅读
有的pdf文件不能打开阅读怎么办?阅读效果差想让阅读效果更好一些怎么办?其实这些问题用pdf阅读器就可以解决啦. 轻快pdf阅读器是一个非常便捷的pdf阅读器,它具有个性化的阅读模式,支持单页以及书本 ...
html 在线打开pdf文件怎么打开,在HTML中打开pdf文件怎么打开
回答: PDF是Portable Document Format的简称,意为"便携式文档格式",是由Adobe Systems用于与应用程序.操作系统.硬件无关的方式进行文件交换所 ...

WebApp打开服务器端pdf文件

pdf.js使用步骤

一. 到官网下载 pdf.js 插件并解压 (地址: http://mozilla.github.io/pdf.js/ )

1: 进入官网

WebApp打开服务器端pdf文件相关推荐

最新文章

热门文章