pdf.js在线浏览pdf文档使用方法

  • Post author:
  • Post category:其他


使用插件:pdf.js

下载地址:

http://mozilla.github.io/pdf.js/getting_started/#download

选择stable版本下载即可

使用条件:必须将该插件放在服务器上,tomcat的话就是放在webapp下

示例pdf:将该插件放到服务器上后,打开viewer.html即可查看该插件提供的示例pdf文档。

扩展:我们会发现它提供的示例pdf文档是放在和viewer.html同级目录下,实际上只要放在webapp下都是可以的,只要路径是对的

通过该插件有两种方法浏览pdf:

方法一:直接修改默认浏览的pdf文档,修改viewer.js里的DEFAULT_URL即可(pdf文档路径要填对)

var DEFAULT_URL = 'compressed.tracemonkey-pldi-09.pdf';

方法二:通过url传参:url路径?file=+pdf文档路径(这里最好先把view.js里的DEFAUlt_URL设为空字符串)

例:

http://localhost:63342/2018-7-30-pdf.js/compressed-version/pdfjs-1.9.426-dist/web/viewer.html?file=caseFile.pdf



如何集成到自己的web前端项目中呢?







主要是使用iframe标签,例:通过<iframe src=”pdf文档浏览路径”></iframe>即可嵌入项目当中。



注意:这里我们发现,我们所浏览的pdf文档都是放在webapp下的,如果我们所浏览的pdf文档比较大,都放在webapp下面肯定是不行的,如果我们把该路径改成远程文件路或者本地某一个磁盘路径,就会出现跨域的问题,于是需要将文件转成文件流的形式,具体参考我的另一篇博客:



https://blog.csdn.net/a973685825/article/details/81169689



版权声明:本文为a973685825原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。