使用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/ 支持获取文件流到客户端 ...
随机推荐
- 小白月赛22 F: 累乘数字
F:累乘数字 考察点: 思维,高精度 坑点 : 模拟就 OK 析题得侃: 如果你思维比较灵敏:直接输出这个数+ d 个 "00"就行了 当然,我还没有那么灵敏,只能用大数来搞了 关 ...
- 深入浅出Mybatis系列六-objectFactory、plugins、mappers简介与配置
注:本文转载自南轲梦 注:博主 Chloneda:个人博客 | 博客园 | Github | Gitee | 知乎 上篇文章<深入浅出Mybatis系列(五)---TypeHandler简介及配 ...
- 《深入理解java虚拟机》读书笔记六——第七章
第七章 虚拟机类加载机制 1.类加载的时机 虚拟机的类加载机制: 虚拟机把描述类的数据从class文件中加载到内存,并对数据进行校验.转换解析和初始化,最终形成了可以被虚拟机直接使用的Java类型,这 ...
- 牛客网——剑指offer(跳台阶以及变态跳台阶_java实现)
首先说一个剪枝的概念: 剪枝出现在递归和类递归程序里,因为递归操作用图来表示就是一棵树,树有很多分叉,如果不作处理,就有很多重复分叉,会降低效率,如果能把这些分叉先行记录下来,就可以大大提升效率——这 ...
- clone()与clone(true)的用法
clone() 方法生成被选元素的副本,包含子节点.文本和属性. 使用 clone(true) 方法在clone()的基础上还包括克隆元素的事件处理器.
- C++——动态内存分配1
9.动态内存分配 new 类型名T(初值列表) 其功能是在程序执行期间申请用于存放T类型对象的内存空间,并依初值列表赋以初值,结果值:成功则T类型的指针,指向新分配的内存:失败则为0(null).若 ...
- Oracle - 拼接多个字段 - wm_concat()函数
Oracle wm_concat()函数oracle wm_concat(column)函数使我们经常会使用到的,下面就教您如何使用oraclewm_concat(column)函数实现字段合并如:s ...
- JUC之CountDownLatch和CyclicBarrier的区别 (转)
CountDownLatch和CyclicBarrier的功能看起来很相似,不易区分,有一种谜之的神秘.本文将通过通俗的例子并结合代码讲解两者的使用方法和区别. CountDownLatch和Cycl ...
- CSS 自适应导航菜单
文章目录 以前我写了一篇关于如何为自适应网页制作教程手机导航菜单,现在我又摸索出一种无需JS脚本的自适应导航菜单,它采用纯粹的语义化HTML5标签来完成.该菜单可以左对齐,居中或右对齐,也不像上一种方 ...
- AcWing 1022. 宠物小精灵之收服 二维费用背包
#include<iostream> using namespace std ; ; int f[N][N]; int V1,V2,n; int main() { cin>>V ...