阅读 167

pdf.js插件的使用

最近工作中遇到要展示pdf的功能,找到了pdf.js这个插件,很好用,记一笔
首先,上官网:
其次,这个插件可能在PC端使用的比较多,比较重量级,我的项目是app中使用的,通过外链展示pdf,目前自测无问题,有人反馈vivo某个版本貌似打不开(没有具体看到情况),总之我还是觉得比较好用的。
最后,上使用方法:
1、先下载项目,可以去官网自行下载,也可以通过我的码云仓库下载:
2、pdfJs的目录结构(如图):

build是一些核心文件,web中的viewer.html就是需要使用到的母版文件。
3、将整个文件夹放入自己的工程文件里,因为在使用的过程中要跳转至母版文件,所以要注意文件的放置位置要方便使用。
4、代码:
1)、可以直接通过a标签的href跳转:
2)、我的项目之前用的mui,打开方式为:
  mui.openWindow({
      id: ‘pdf_detail‘,
      url:‘../pdfjs/web/viewer.html?file=‘+url
  });
这里的url是后台返回的pdf存放地址。

注意:在用的过程中遇到了跨域的问题,于是大概在viewer.js文件的2100行上下注释掉了以下代码:
 // if (origin !== viewerOrigin && protocol !== "blob:") {
  //   throw new Error("file origin does not match viewer‘s");
  //}
  
最终效果图:
![](https://img2020.cnblogs.com/blog/1548720/202108/1548720-20210831145021051-2139406326.jpg)

可以看到左侧是缩略图,右侧菜单还有各项功能,小朋友们可以去使用一下,移动端还可以启用手形工具,我的截图里把部分功能隐藏了,大家可以来试试,欢迎使用后留言探讨。

学习随笔,如有不周,望请海涵,欢迎小伙伴们各种讨论、指正。

路漫漫其修远,脚步不要停!!!

原文:https://www.cnblogs.com/hyser/p/15210371.html

文章分类
代码人生
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐