移动端支持查看pdf文件

这个pdf.js只要配置好，只需一句代码
pdf.js只能展示项目中的PDF文件，不支持跨域展示别的网站上的PDF文件

pdf.js官网下载：http://mozilla.github.io/pdf.js/  
pdf.js文件我的网盘下载 (版本v2.0.943) ：
链接：https://pan.baidu.com/s/1VIjRrITUVlxpau5EEMsGtA       提取码：ayj4 

下载后文件夹下有2个文件夹：

●第一种方式：在你的项目创建一个pdf文件夹，将上面的两个文件夹复制过来

可看到web文件夹下面：

有个viewer.html文件，本地打开这个viewer.html文件是获取不到默认的compressed.tracemonkey-pldi-09.pdf这个PDF文件，会出现错误，如：

需要在服务器中打开才行，第一次使用pdf.js，建议先在本地中打开查看效果。如果想在本地打开，新建个文件夹，假设名为test，将build和web这两个文件夹复制到test文件夹中，再用phpstudy设置test为本地服务器，打开web里的viewer.html文件，就能看到效果。

如果你的项目可以通过这种方式打开vuewer.html文件，就可以通过以下的链接去打开对应的pdf文件

<a href="/xxxxx/web/viewer.html?file=你的pdf地址">查看pdf</a>

比如 href="/xxxxx/web/viewer.html?file="/xxxxx/web/compressed.tracemonkey-pldi-09.pdf"。你的pdf地址可以是相对路径，也可以是绝对路径

 

●第二种方式：如果你跟我一样，html只能写的指定的文件夹中，js等文件也只能写到指定的文件夹中，

1、将build和web这两个文件夹复制到js文件下新建的pdf文件夹中

2、在新建的html文件中（我这里是demopdf.html），将viewer.html里的所有内容复制到这个demopdf.html文件中

3、在demopdf.html需要使用绝对路径修改引用文件的地址：

      css文件地址：<link rel="stylesheet" href="/res/mobile/js/pdf/web/viewer.css"> 

       locale.properties文件地址：<link rel="resource" type="application/l10n" href="/res/mobile/js/pdf/web/locale/locale.properties">

        pdf.js文件地址：<script src="/res/mobile/js/pdf/build/pdf.js"></script>

        viewer.js文件地址：<script src="/res/mobile/js/pdf/web/viewer.js"></script>

4、修改js/pdf/web/viewer.js这个文件的参数：

        默认pdf地址（可改可不改，可以通过链接的形式查看哪个路径下的pdf）：

      pdf.worker.js文件地址：

5、存放你的pdf文件，你想放哪都可以，我这里是放到了js/pdf/web/demo.pdf文件夹下（和viewer.html同文件夹）。

6、通过以下链接去查看指定路径的pdf文件。你的pdf地址可以是相对路径，也可以是绝对路径

<a href="/xxxxx/web/viewer.html?file=你的pdf地址">查看pdf</a>

我这里是：<a href="/mobile/contract/demopdf?file=/res/mobile/js/pdf/web/demo.pdf">查看pdf</a>