pdf在线解析html代码,web在线预览PDF，PDF.js源码解析

web在线预览PDF，PDF.js源码解析

程序员学习大纲

http://www.voidcn.com/article/p-tnbegtbt-bms.html

本套教程(视频，课件，源码)索取QQ：1225462853

CN1019-PDF.js源码解析及样例Demo运行效果

在线浏览PDF之PDF.JS (附demo)

pdf.js框架的魅⼒所在，为其为HTML5实现的，⽆需任何本地⽀持，⽽且对浏览器的兼容性也是⽐较好，

要求只有⼀个：浏览器⽀持HTML5就好了！(不过对于低版本的IE，就只能节哀了！)

PDF.js是githut上的一个开源项目，具体源码可以到githut上下载，地址：

https://github.com/mozilla/pdf.js/。

直接装有git工具的可以克隆到本地,命令：$ git clone git://github.com/mozilla/pdf.js.git c:/xxxx (此为你要储存的本地路径)，

没有安装git工具的可以直接下载zip压缩包，

全局安装gulp工具，执行命令：npm install -g gulp，成功后查看版本：

全局安装完成后，进入到PDF.js源码解压目录并执行：npm install 进行本地安装。(本地安装是指每个项目使用到的gulp插件 的安装，具体可以在网上找到详细初始化说明，由于PDF.js项目解压后包含了package.json、gulpfile.js这些初始需要的文件，所以直接执行npm install的命令即可，注意：一定要进入到项目的目录执行命令 ),执行命令后会看到安装一堆的插件。安装时长跟网络有关

完成 后再执行gulp -v可以看到比之前多了一条本地gulp的信息

成功之后进行构建：gulp generic ,成功后会多一个build目录,build目录包含generic目录。

将generic目录拷贝到Tomcat的webapps目录，启动Tomcat后访问web/viewer.html路径就可以看到示例pdf文件的在线预览了。

pdf文件路径由viewer.js文件中DEFAULT_URL变量确定，如果想动态确定文件可以在访问路径中后加上参

数,例如：web/viewer.html?file=../abcd.pdf。

file参数为空时，viewer.js才会读取DEFAULT_URL变量。具体代码看viewer.js的webViewerInitialized函

数：

file = 'file' in params ? params.file : DEFAULT_URL;

上述步骤概要：

================