因我的项目开发须要在线展现 PDF文件,为解决 PDF文件 在浏览器关上后电子签章、电子签名等展现不全且局部浏览器兼容问题特利用pdf.js解决该问题;
pdf.js框架为HTML5,无需任何本地反对,兼容性极好只有浏览器反对 HTML5 即可(据说 IE9 以上都是能够的);
过后解决该问题摸索工夫比拟长,其实也并没有设想的那么艰难比较简单特此记录下此博客,以便大家参考!
pdf.js git地址 : https://github.com/mozilla/pd… pdf.js官网自行下载包) 有相干根本简介、获取源码及构建
以自行下载包为例
我的项目构建后 会呈现如下两个动态文件夹:
build目录是PDF.js的外围文件,web目录是PDF.js的配置与显示文件
viewer.html是用来显示PDF文件的跳转页面,viewer.js是其对应配置文件,在viewer.js中:
动态替换PDF文件门路 此时便可通过拜访viewer.html对应门路查看并操作以后 动态PDF文件门路
有的小伙伴会说了这基本满足不了以后我的项目需要嘛 谁的PDF文件会是动态的 对喽 想到这就阐明大家在思考了那么接下来我就向大家简略介绍下动静生成的PDF文件地址该如何赋值~
首先要留神咱们的PDF文件有两种办法能够带入进viewer.html中展现
将指定PDF文件放在 web文件夹下 通过指定引入动态文件形式引入
将PDF文件放入服务上以服务地址读取
上面重点讲下 通过接口返回地址拿到地址并展现废话不多说间接上代码:
同时我么们还要将源码中的判断跨域代码正文掉
当所有做完后咱们就能够实现PDF文件页面浏览但还会发现签章问题没有失去解决 电子生成签章会不显示 咱们能够通过正文pdf.worker.js源码的形式来解决该问题
个别状况下,正文掉了这三行代码,不显示的签名或者电子签章就该显示了。然而 正文了这三行代码,还是报谬误,而且是 util.js 报的
所以第二种办法 咱们在 pdf.worker.js 中找一下报错地位
与控制台报错正告很像吧,求证后就是他接下来就阻断他 Perfect
到这儿明天的内容就差不多了,心愿能对你们有帮忙!!!