PDF.js插件 | 在线PDF阅读插件，支持手机在线阅读

今天在写论文时候参考大疆无人机的阅读文档时候，发现大疆的PDF在线阅读就是使用了PDF.js插件书写。正好想起来那时候一个在线阅读的项目使用过今天在这里给大家详细讲解一下。

目录

一、下载安装软件项目

二、修改代码

---

一、下载安装软件项目

1、PDF.js是火狐公司出品的插件。插件下载以及预览请点击。http://mozilla.github.io/pdf.js/

2、下载完成之后，解压有两个文件分别是build和web。从字面意思就能明白这两个文件的作用。然后放在服务器相应的路径。

直接在本地打开web/viewer.html，发现并不能成功打开。会出现错误，错误如下图所示：

出现这个问题是本地问题，不是你安装不正确或者是代码错误的问题，只需要我们上传到服务器就可以正常的预览。

二、修改代码

1、上传服务器之后打开web/viewer.html发现可以正常预览。我们发现了，viewer.js中defaultUrl后面只能放一个文件名，如果我要展示多个应该如何呢？

2、这样我们viewer.html可以通过页面参数传值的方式加载pdf文件，先把viewer.js中的参数修改为空如下所示：

defaultUrl: {
    value: '',
    kind: OptionKind.VIEWER
  },

然后在viewer.html最后</body>之前添加下面的代码即可，这样我们就可以通过文件路径进行查看每一个文件，如下：

<a href="自己的文件路径/web/viewer.html?file=../../../../文件名.pdf" target="view_window"></a>

3、这样只需要把pdf放在网址对应的文件夹目录里面（在这儿所放的位置一定要和网址的路径对起来，否则无法访问的），这样我们通过不同网址就可以正常的访问不同的PDF啦。

好啦，在线预览PDF就到这儿结束了，如有不会的可以留言咨询呀。