关于PDFJS在线预览

     之前做过PDF预览,在本项目中,本是之前做好了,项目经理突然要求要后台给前传文件流的方式来预览,这可把我给蛋疼的,在网上搜罗一翻,找到PDFJS来实现效果,在网上找了各种资料,可是就是不显示啊有木有,经过两的时间  总算找到了原因,我不知道网上其他大牛是怎么做出来的,反正我按照他们的方式是不行,下面来说说我遇到的问题,整理一下,希望能帮助遇到和我一样问题的同学!

首先来看看网上的说法:

 

第一步:下载源码https://github.com/mozilla/pdf.js

第二步:构建PDF.js

第三步:修改viewer.js

var DEFAULT_URL 'compressed.tracemonkey-pldi-09.pdf'  里面是PDF的路径

删除该变量定义;

第四步:通过ajax的方式获取文件流数据,并处理。

Js代码   收藏代码
  1. var DEFAULT_URL = "";//注意,删除的变量在这里重新定义  
  2. var PDFData = "";  
  3. $.ajax({  
  4.     type:"post",  
  5.     async:false,  
  6.     mimeType: 'text/plain; charset=x-user-defined',  
  7.     url:文件流请求地址,  
  8.     success:function(data){  
  9.        PDFData = data;  
  10.     }  
  11. });  
  12. var rawLength = PDFData.length;  
  13. //转换成pdf.js能直接解析的Uint8Array类型,见pdf.js-4068  
  14. var array = new Uint8Array(new ArrayBuffer(rawLength));    
  15. for(i = 0; i < rawLength; i++) {  
  16.   array[i] = PDFData.charCodeAt(i) & 0xff;  
  17. }  
  18. DEFAULT_URL = array;  

 第五步:将上面的代码作为js文件或是代码片段,加入viewer.html(上面的代码要放在<script src="viewer.js"></script>引入之前)。

问题来了,我就是按照这种方法来的  可死活就是不行,经过对问题的查找,找到了问题所在:

那就是viewer.js中的这个方法在ajax请求这前就执行了,所以DEFAULT_URL 一直是空,于是我改了下这个方法,在webViewerInitialized()中加了一个方法参数,在页面js中的相应方法也改了!


果然:问题完美解决!

大家要是还有什么不明的,可以直接下载我改过后的PDFJS的demo: 

http://download.csdn.net/download/qq616138361/9943149

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值