博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
在web项目中集成pdf.js的默认查看器
阅读量:6637 次
发布时间:2019-06-25

本文共 1130 字,大约阅读时间需要 3 分钟。

Mozilla开源的一项用于在HTML5平台上显示pdf文档的技术,Mozilla自己的Firefox浏览器也用了pdf.js来预览pdf,可见应该是一个比较成熟稳定的方案(btw,chrome用的是foxit的技术,国人骄傲啊)。当然类似的方案有很多,并且大多都提供了丰富的,如果你仔细读文档/api,可能会有好的收获,但是Mozilla同时把在Firefox内的查看器也一道开源了,对于大部分定制性不强,只需要浏览的使用场景来说,似乎可以直接“拿来主义”,本文就说的是如何直接使用这个自带的viewer

前提,既然是基于HTML5的方案,那么浏览器兼容性是个大问题,官方尽可能地做了兼容(通过compatibility.js文件),但是仍然无法支持IE9以下的浏览器,,IE9以下要支持,要么换方案,要么直接在不支持的情况下显示下载链接吧。

1,下载源码

git clone https://github.com/mozilla/pdf.js.git pdfjscd pdfjs

2, 编译

需要node环境

node make generic

这会在你的根目录下生成一个build文件夹,目录结构:

/    generic        build            pdf.js            pdf.worker.js        web            ...

其中,build路径下是主程序,web路径下是查看器程序

3, 运行网站

node make server

你也可以用发布在自己的任意web服务器,用上述命令可以以当前目录pdfjs为根目录伺服一个网站,你可以顺便查看下examples里面的内容,以及web(这就是Mozilla的pdf查看器所在)里面的内容。

当然,你也可以直接跑到上一节生成的generic目录下伺服一个网站,这会让事情显得简单很多。总之,网站部署好后,我们只要找到web路径下的view.html静态文件,然后传入file=xxx.pdf形式的参数即可,比如:

http://myapp.mycompany.com/web/viewer.html?file=http://myapp.mycompany.com/my-PDF-file.pdf

(同站文件用相对路径当然也没问题)

4, 修改部署路径

如果你的项目部署并不是generic/build&web(肯定大多数不是),你只需要更改·文件里面的pdf.js路径为你的真实路径,

以及·里面的‘pdf.worker.js’为你的真实路径即可

PDFJS.workerSrc = '../build/pdf.worker.js';

参考:

转载地址:http://qoivo.baihongyu.com/

你可能感兴趣的文章
C++ Primer Plus 笔记第十三章
查看>>
岩心数字化管理系统系列(二)系统管理篇
查看>>
唐雎不辱使命
查看>>
github如何多人开发一个项目
查看>>
html5--3.22 综合实例03
查看>>
去掉字符串间的各种符号
查看>>
Openstack 实现技术分解 (4) 通用技术 — TaskFlow
查看>>
C# DataTable 转换为 实体类对象方法
查看>>
序言 Preface
查看>>
逆序数
查看>>
spoj 2211. Mars Map
查看>>
apache 的虚拟主机和 web访问时序图
查看>>
Block介绍(二)内存管理与其他特性
查看>>
《R语言实战》读书笔记-- 第六章 基本图形
查看>>
烽火传递
查看>>
VS2013编写的C#程序,在xp下会报错说“不是合法的win32程序”。
查看>>
PL SQL显示的字段长度不全
查看>>
微信支付开发h5发起支付再次签名,返回给h5前端
查看>>
[Altera]PLL仿真
查看>>
PM2 指令简介
查看>>