使用pdf.js显示pdf文件
<script type="text/javascript" src="build/pdf.min.js"></script>
<script type="text/javascript">
PDFJS.workerSrc = 'build/pdf.worker.min.js';
</script>
<script type="text/javascript">
$.fn.showPDF = function(pdfUrl, opt){
var options = $.extend({
scale: 1,
pageNum: 1
}, opt || {}); this.each(function(){
var pdfDoc,
canvas = document.createElement('canvas'),
ctx = canvas.getContext('2d');
$(this).append(canvas); function renderPage(num) {
pdfDoc.getPage(num).then(function (page) {
var viewport;
if( typeof(options.width) == 'number' ){
viewport = page.getViewport(1);
options.scale = options.width / viewport.width;
}
viewport = page.getViewport(options.scale);
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: ctx,
viewport: viewport
};
page.render(renderContext).promise.then(function () {
if( $.isFunction(options.afterShow) ){
options.afterShow();
}
});
});
} if( $.isFunction(options.beforeShow) ){
options.beforeShow();
} PDFJS.getDocument(pdfUrl).then(function (doc){
pdfDoc = doc;
renderPage(options.pageNum);
});
});
} $(function(){
$('.pdfView').showPDF('1.pdf', {width: $(window).width()});
});
</script>
PDF.js https://mozilla.github.io/pdf.js/
使用pdf.js显示pdf文件的更多相关文章
- pdf.js 预览文件中文内容丢失
问题: 在.netcore中使用pdf.js,pdf中有部分中文无法显示 在浏览器控制台发现有报错 发现在pdf.view.js中url路径异常,没有指向cmaps文件,于是调整了正确的相对路径 再次 ...
- pdf.js显示合同签名问题
需求 pdf页面显示在ios11以下的环境,合同的签名印章或签字会显示不出 解决方案(初步处理参考下文引用,这里是后续具体做法) 现在通过使用pdf.js插件,参考下文,引入自己的代码 我把gener ...
- 使用PDF.JS实现pdf文件在线预览时,报文件被损坏的错误
首先大概说明一下问题出现的背景:我用PDF.JS实现文件在线预览,参考网上的办法,在jsp文件中使用 <iframe src="<c:url value="js/gen ...
- PDF.Js的使用—javascript中前端显示pdf文件
PDF.Js的使用—javascript中前端显示pdf文件 写于2018/12/6 起因是一个图片展示页面需要展示pdf格式的文件,所以查了半天决定使用pdf.js,我也不求有多了解它,能实现我想要 ...
- 基于VUE利用pdf.js实现文件流形式的pdf显示
首先推荐大家看一下这个demo vue-pdf.js-demo,这里面包含固定本地地址,远程pdf地址,通过打开文件的方式打开pdf 这儿我们着重介绍一下通过文件流的形式打开pdf.(所谓文件流,就是 ...
- 使用 pdf.js 在网页中加载 pdf 文件
在网页中加载并显示PDF文件是最常见的业务需求.例如以下应用场景:(1)在电商网站上购物之后,下载电子发票之前先预览发票.(2)电子商务管理系统中查看发布的公文,公文文件一般是PDF格式的文件. 目前 ...
- fis3+vue+pdf.js制作预览PDF文件或其他
人生第一篇博客,的确有点紧张,但有些许兴奋,因为这对于我来说应该是一个好的开始,以此励志在技术的道路上越走越远. 看过了多多少少的技术博客,给自己带来了很多技术上的收获,也因此在想什么时候自己也可以赠 ...
- base64编码后的pdf文件前端页面展示--pdf.js的应用
最近在整理项目中用到的插件或者使用心得,感觉还是写成博客,能加深新一层的理解. 我先说一下我的需求:由于java后台编译的文件流在手机端加载速度太慢,所以想着可以在前端解析,放在页面展示给用户. 所以 ...
- vue文件流转换成pdf预览(pdf.js+iframe)
参考文档:https://www.jianshu.com/p/242525315bf6 PDFJS: https://mozilla.github.io/pdf.js/ 支持获取文件流到客户端 ...
随机推荐
- equals 为什么要把常量写在前面?
看例子 使用str1.equals("abc"); 如果str1是null,空是没有equals方法的,会抛出空指针异常 如果"abc".equals(str1 ...
- BSGS求解离散对数问题
离散对数问题是求解axΞb mod(n) 同余方程 以下模板使用于gcd(a,n)=1的情况 ; int hs[mod],head[mod],Next[mod],id[mod],top; void i ...
- 洛谷p1980 计数问题
题目描述 试计算在区间 111 到 nn n的所有整数中,数字x(0≤x≤9) x(0 ≤ x ≤ 9)x(0≤x≤9)共出现了多少次?例如,在 111到11 11 11中,即在 1,2,3,4,5, ...
- 展开折叠效果 height未知 transition无效
展开折叠效果,没有设置height时 transition 不起作用 可以设置max-height .default { max-height: 500px; transition: all 1000 ...
- Switch The LED Holiday Light To Illuminate The Cheerful Holidays
I like how LED holiday lights add a little magic to the holidays. Want an easy way to reduce your va ...
- Qt Gui 第一章~第二章
一.Qt启动 qmake -project; 创建xxx.pro qmake xxx.pro; 生成makefile文件 make:构建该程序,生成可执行文件 运行程序:windows:xxx:mac ...
- 论文阅读笔记(三)【AAAI2017】:Learning Heterogeneous Dictionary Pair with Feature Projection Matrix for Pedestrian Video Retrieval via Single Query Image
Introduction (1)IVPR问题: 根据一张图片从视频中识别出行人的方法称为 image to video person re-id(IVPR) 应用: ① 通过嫌犯照片,从视频中识别出嫌 ...
- [CF859C] Pie Rules - dp,博弈论
有一个长度为n的序列,Alice和Bob在玩游戏.Bob先手掌握决策权. 他们从左向右扫整个序列,在任意时刻,拥有决策权的人有如下两个选择: 将当前的数加到自己的得分中,并将决策权给对方,对方将获得下 ...
- [CQOI2007] 余数求和 - 整除分块
\(\sum_{i=1}^n\;k\;mod\;i\) Solution \(\sum_{i=1}^n\;k\;mod\;i\\=\sum_{i=1}^n(k-i\lfloor{\frac{k}{i} ...
- nginx 启动报错找不到nginx.pid文件
这个问题的出现应该是系统找不到nginx的配置文件nginx.conf,所以,我们要告诉系统配置文件的位置:' --- 使用nginx -c /usr/local/nginx/conf/nginx.c ...