从github下载的源码不能直接使用,最好使用命令行下载安装

1、下载源码

  git clone git://github.com/mozilla/pdf.js.git

  cd pdf.js

2、安装node.js

https://nodejs.org/en/download/

3、安装gulp

 sudo npm install -g gulp-cli

4、安装pdf.js的依赖库

  sudo npm install

5、启动本地web服务,因为有的浏览器不允许用file://协议打开pdf文件

sudo gulp server

6、构建PDF.js

 sudo gulp generic

  这将在build / generic / build /目录中生成pdf.js和pdf.worker.js。 这两个脚本都是必需的,但是只有pdf.js需要被包含,因为pdf.worker.js将由pdf.js加载。 PDF.js文件很大,应该细化生产。

也可下载我的构建版本 链接:https://pan.baidu.com/s/1o7AjqaA

7、在项目中引入入构建后的pdf.js

  

<script type="text/javascript" src="generic/build/pdf.js"></script>
...

<canvas id="canvas"></canvas>
$(function(){
var url = '../compressed.tracemonkey-pldi-09.pdf';
PDFJS.workerSrc = 'generic/build/pdf.worker.js';
PDFJS.getDocument(url).then(function getPdf(pdf) {
pdf.getPage(2).then(function getPage(page) {
var scale = 1;
var viewport = page.getViewport(scale);
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
});
});

8、使用viewer.html加载pdf

http://localhost:6443/web/PDFDemo/pdfjs/generic/web/viewer.html?file=../../../swift.pdf

在viewer.html后面跟着file=xxx.pdf,可以直接用viewer.html渲染pdf,这种方式附带pdf工具栏

  

  

 

pdf.js安装步骤和使用的更多相关文章

  1. 【Node.js安装步骤】

    "Node.js是一个Javascript运行环境(runtime environment),发布于2009年5月,由Ryan Dahl开发,实质是对Chrome V8引擎进行了封装.本文详 ...

  2. node.js安装步骤

    首先这是node.js的官网:https://nodejs.org/en/ 截至2017年12月9日,node更新在8.9.3该版本,建议开发人员下载6.0以上版本,8以上不是很稳定!  如果有其他需 ...

  3. node.js 安装步骤

    1.打开链接(http://nodejs.cn/download/) 2.下载自己所需的安装包(32位 or 64位.哪个系统) 3.双击直接安装(成功如下图) 4.点击 Node.js comman ...

  4. PDF.js Electron Viewer

    PDF.js 是基于 HTML5 解析与渲染 PDF 的 JavaScript 库,由 Mozilla 主导开源. 本文旨在介绍 PDF.js 于 Electron 里如何开始使用,实际尝试了用其 A ...

  5. node.js和express.js安装和使用步骤 [windows]

    PS: NODEJS:https://nodejs.org NPM:https://www.npmjs.com/ 一.node.js安装与配置 到https://nodejs.org/en/downl ...

  6. Node.js安装详细步骤教程(Windows版)

    什么是Node.js? 简单的说 Node.js 就是运行在服务端的 JavaScript. Node.js是一个基于 Chrome V8 引擎的 JavaScript 运行环境: Node.js使用 ...

  7. PhantomJS linux系统下安装步骤及使用方法(网页截屏功能)

    PhantomJS 是一个基于 WebKit 的服务器端 JavaScript API.它全面支持web而不需浏览器支持,其快速,原生支持各种Web标准: DOM 处理, CSS 选择器, JSON, ...

  8. [转]phoneGap3.0安装步骤(以windows下的android环境为例):

    phoneGap3.0安装步骤(以windows下的android环境为例): 环境: WIN系统,JDK,Android,Eclipse,Ant,Git,PhoneGap3.x (Cordova) ...

  9. pdf.js使用教程

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

随机推荐

  1. android+myeclipse+mysql下拉框数据绑定

    原创作品,允许转载,转载时请务必声明作者信息和本声明.http://www.cnblogs.com/zhu520/p/8027036.html 本人小白,那个大神看到有问题可指出,谢谢.... 一:我 ...

  2. C++里的模板

     1.泛型编程 --即实现一个通用的标准容器库. 所谓通用的标准容器库,就是要做到:比方List类存放全部肯恩类型的对象这样的事:泛型编程让你编写一个全然一般化并可反复使用的算法,其效率与针对某特定数 ...

  3. LintCode-最大子数组差

    给定一个整数数组,找出两个不重叠的子数组A和B,使两个子数组和的差的绝对值|SUM(A) - SUM(B)|最大. 返回这个最大的差值. 您在真实的面试中是否遇到过这个题? Yes 例子 给出数组[1 ...

  4. HDOJ 5414 CRB and String 模拟

    CRB and String Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others) T ...

  5. EC2 开启 IPV6 访问 和 禁止重启后自动分配IP地址

    EC2 开启 IPV6 访问 和 禁止重启后自动分配IP地址进入 VPC 控制台,对当前 VPC 添加 IPV6 CIDR 块对该 VPC 的路由表进行修改,添加其它路由,第一个空填::/0,第二个空 ...

  6. vim 配置.vimrc文件

    下面这个.vimrc文件是根据公司里的一个前辈配置的,这里记录下,方便以后使用.它的功能,其实跟网上很多.vimrc配置的相比,还是小儿科.我记录下来,主要还是因为自己已经习惯了这个工作环境跟快捷键. ...

  7. 77.深入理解nodejs中Express的中间件

    转自:https://blog.csdn.net/huang100qi/article/details/80220012 Express是一个基于Node.js平台的web应用开发框架,在Node.j ...

  8. Spark MLlib协同过滤算法

    算法说明 协同过滤(Collaborative Filtering,简称CF,WIKI上的定义是:简单来说是利用某个兴趣相投.拥有共同经验之群体的喜好来推荐感兴趣的资讯给使用者,个人透过合作的机制给予 ...

  9. Glide二次封装库的使用

    更多代码可以查询本人GitHub:欢迎阅读,star点起来. Glide二次封装库源码 前言 为什么选择Glide? Glide 轻量级 速度快 可以根据所需加载图片的大小自动适配所需分辨率的图 支持 ...

  10. POj 2159 Dividing

    Dividing Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 71453   Accepted: 18631 Descri ...