使用pdf.js在web页面展示pdf文件

最近弄的项目中需要在线展示PDF文件，以前用的是Adobe PDF阅读器直接在浏览器端打开的，这要求客户端必须安装这个软件，若是没有安装就不能在线预览了。为了解决这个问题，最终决定用pdf.js来实现预览功能。

 

1、PDF.js下载：

下载链接：http://mozilla.github.io/pdf.js/

下载下来的压缩包包含两个文件夹：build和web，打开web文件夹下的viewer.html，就能看到PDF的预览效果了。

预览的PDF文件是位于viewer.html同目录下的compressed.tracemonkey-pldi-09.pdf，

而设置加载这个文件的地方是：与viewer.html同目录下的viewer.js的DEFAULT_URL属性，修改这个属性的值就能够预览不同的文件，中英文的pdf文件都能成功预览。

 

2、功能使用：

使用pdf.js在web页展示pdf文件的关键是打开viewer.html，也就是在web页打开一个html，可以用的方法至少有两三种：

a、a标签：<a href="PDFJS\web\viewer.html">使用pdf.js展示pdf文件</>

b、window.open：window.open("PDFJS\web\viewer.html");

c、iframe：<iframe  src="PDFJS\web\viewer.html" />

 

3、在客户端预览服务器端的文件：使用文件流进行解决

以我此次使用的情况为例，我使用的iframe进行展示：

第一步：设置iframe的请求路径：

var src="pdfjs/web/viewer.html?file=/testWeb/fileRouter!openDocInPdf.action";

 

说明：