刚好遇到需求，需要在手机端--展示一个电子收据，电子收据返回是PDF格式的，所以需要在前端上面去做PDF预览。

在学习过程中，了解到一种很简单，不需要任何插件的方法做PDF预览，但是这方法有局限性.

代码如下：

<object data="../assets/09.pdf" type="application/pdf" width="100%" height="100%">
<iframe src="../assets/09.pdf" width="100%" height="100%" style="border: none;">
 
This browser does not support PDFs. Please download the PDF to view it: <a href="/index.pdf">Download PDF</a>
 
</iframe>
 
</object>
直接在HTML，中嵌入上诉代码，在支持PDF格式的浏览器中就可以直接查看了。
局限性：低版本IE，不能直接查看，  手机端这样使用的话，iOS可以直接预览PDF，但是安卓手机回提示下载，不能直接预览。
 
那么我们就要使用第二种方法。
 
引入PDF.js文件进行展示， 遇到一个很不错的写pdf.js如何使用的文章，我 就不写了 ，直接附上地址吧
https://blog.csdn.net/li_cheng_liang/article/details/75332938
 
 
 

JS展示预览PDF。的更多相关文章

  1. fis3+vue+pdf.js制作预览PDF文件或其他

    人生第一篇博客,的确有点紧张,但有些许兴奋,因为这对于我来说应该是一个好的开始,以此励志在技术的道路上越走越远. 看过了多多少少的技术博客,给自己带来了很多技术上的收获,也因此在想什么时候自己也可以赠 ...

  2. pc或者微信上用pdf.js在线预览pdf和word

    最近项目要求pdf和word可以在线预览功能,pc端还好解决,但是微信端就有点坑了,pc端原来的思路是将文件转成base64,然后用html格式显示 ,但是微信端不支持, 这种方式就pass掉了,谷歌 ...

  3. [pdf.js]预览pdf时，中文名称乱码的问题

    在项目中使用了pdf.js的方式预览pdf,但针对中文名称的时候会出现乱码,导致找不到该文件而出现错误. 解决办法 <script src="viewer.js" chars ...

  4. 前端使用pdf.js预览pdf文件

    现在的浏览器基本都支持直接把pdf文件拖到浏览器就可以打开了,不用安装额外的插件.但是不同的浏览器显示的页面不一样.如果我们想在网页上统一预览pdf怎样实现呢? Mozilla开源了一个插件pdf.j ...

  5. 用pdf.js实现在移动端在线预览pdf文件

    用pdf.js实现在移动端在线预览pdf文件1.下载pdf.js    官网地址:https://mozilla.github.io/pdf.js/ 2.配置    下载下来的文件包,就是一个demo ...

  6. 前端使用pdf.js预览pdf文件,超级简单

    现在的浏览器基本都支持直接把pdf文件拖到浏览器就可以打开了,不用安装额外的插件.但是不同的浏览器显示的页面不一样.如果我们想在网页上统一预览pdf怎样实现呢? Mozilla开源了一个插件pdf.j ...

  7. vue文件流转换成pdf预览(pdf.js+iframe)

    参考文档:https://www.jianshu.com/p/242525315bf6 PDFJS: https://mozilla.github.io/pdf.js/     支持获取文件流到客户端 ...

  8. html页面预览pdf文件使用插件pdfh5.js

    html预览pdf文件需要依赖pdf.js 移动端适配需要pdfh5.js 记录移动端适配pdfh5.js的用发 在线预览: https://www.gjtool.cn/pdfh5/pdf.html? ...

  9. WEB在线预览PDF

    这是我在博客园发表的第一篇文章.以后会陆续把在线预览其他格式文档的解决方案发表出来. 解决思路:把pdf转换成html显示. 在线预览pdf我暂时了解3种解决方案,欢迎大家补充. 方案一: 利用pdf ...

随机推荐

  1. IIS应用池保持激活工具开发

    之前的 开源一个定时任务调度器 webscheduler 中涉及的定时调用应用已经开始在正式环境中启用,发布到IIS下进行测试,发现一旦应用长时间没有访问(大约半个多小时)就会引发 Applicati ...

  2. mysql数据库之表与表之间的关系

    表1 foreign key 表2 则表1的多条记录对应表2的一条记录,即多对一 利用foreign key的原理我们可以制作两张表的多对多,一对一关系 多对多: 表1的多条记录可以对应表2的一条记录 ...

  3. Hive中SELECT TOP N的方法(order by与sort by的区别)

    我想说的SELECT TOP N是取最大前N条或者最小前N条. Hive提供了limit关键字,再配合order by可以很容易地实现SELECT TOP N. 但是在Hive中order by只能使 ...

  4. Java基础——深入剖析Java中的装箱和拆箱

    (转自:http://www.cnblogs.com/dolphin0520/p/3780005.html) 自动装箱和拆箱问题是Java中一个老生常谈的问题了,今天我们就来一些看一下装箱和拆箱中的若 ...

  5. Windows使用Github

    首先,你需要执行下面两条命令,作为 git 的基础配置,作用是告诉 git 你是谁,你输入的信息将出现在你创建的提交中. git config --global user.name "你的名 ...

  6. 8.使用hydra对端口进行爆破

    如果对开启端口的服务不清楚,请看我之前写的文章:https://www.cnblogs.com/bmjoker/p/8833316.html 2018,网站的防护(sql,xss...)的安全保护也已 ...

  7. es6基础系列三：解构赋值

    解构就是ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值(只能用于数组,对象或迭代器).如果解构不成功,则等于undefined,但不能赋值为undefined和null,因为undefi ...

  8. HDU 5971 Wrestling Match (二分图)

    题意:给定n个人的两两比赛,每个人要么是good 要么是bad,现在问你能不能唯一确定并且是合理的. 析:其实就是一个二分图染色,如果产生矛盾了就是不能,否则就是可以的. 代码如下: #pragma ...

  9. C# 用委托有什么好处？ 它起什么作用？

    什么是委托 首先要知道什么是委托,用最通俗易懂的话来讲,你就可以把委托看成是用来执行方法(函数)的一个东西. 如何使用委托 在使用委托的时候,你可以像对待一个类一样对待它.即先声明,再实例化.只是有点 ...

  10. etcd代理组件的开发思想

    最近在一个项目中,需要使用到etcd集群来实现服务发现的功能,目的是统一管理相应的服务资源,同时也可对资源做一定的负载均衡策略.然而,项目中使用的技术栈是C++语言,github上没有合适的C++开源 ...