网站首页 > 网站设计> 文章内容

pdfjs使用教程

※发布时间:2017-9-10 0:37:05   ※发布作者:habao   ※出自何处: 

  pdf.js框架的魅力所在,为其为HTML5实现的,无需任何本地支持,而且对浏览器的兼容性也是比较好,要求只有一个:浏览器支持HTML5就好了!(不过对于低版本的IE,就只能节哀了!)

  据说IE9以上是OK的,因为我本地是IE11,所以我只在IE11上测试过,是通过的(当然火狐,360,我也测了一下,是可以的)。

  因为项目开发需要,在线展示PDF,而且要兼容IE,所以就选择了pdf.js,但是网上对他的教程很少,我花了一天时间才搞定,回头看了一下,也没有想象中那么困难,所以决定写一篇博客,以便大家参考!

  不知道在Windows7上该怎么用git、node(如果有知道的,可以告诉我下,在此谢过!),所以我就改用linux进行构建(期间有很多心酸历程,感觉都可以拍成电影了!!!比如说我用git获取源码时,系统提示我git没有安装,我用node时,提示我ShellJs没有安装,安装ShellJS,他告诉我要使用npm,意料之中,npm我也没有安装...),其实,我们使用pdf.js,最终只需要构建后的内容,大家可以通过这里进行下载:

  有了构建后的build内容,我们就可以做一个简单的测试,把generic拷贝到Tomcat的webapps中

  实质就是我们直接访问generic/web/viewer.html,然后为其指定一个file形参,用于指定打开的pdf文件!我使用的流的方式进行指定的。

  我们在实际应用中,可能会根据不同的参数,来选择展示不同的pdf文件,此时就涉及到传参的问题了,仔细观察这段url地址会发现,在file请求参数中的值为一个url地址,而这个url地址又追加了自己的请求参数,这就导致一个url地址中出现2个?

  此时,就可以请encodeURIComponent()函数出场了!因为其为js函数,所以需要在文档就绪函数中动态为iframe设置src的值,如下所示:

  既然有编码,那么就一定要有解码来解析他,不过这个工作generic/web/viewer.js已经替我们做过了,如下所示:

  至此,pdf.js插件的介绍就告一段落了,第一次写博客,如有不到之处,希望大家可以不吝赐教,谢谢!

  本站(LinuxIDC)所刊载文章不代表同意其说法或描述,仅为提供更多信息,也不构成任何。

  推荐: