刚好遇到需求，需要在手机端--展示一个电子收据，电子收据返回是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. ES6学习之let和const

    1.let 基本用法:let声明的变量,只在let命令所在的代码块内有效 { let a = 1; var b = 2; } console.log(a) //a is not defined con ...

  2. C# 播放音乐

    用 .NET 自带的类库 System.Media 下面的 SoundPlayer 来播放音乐的方式,此种方式使用托管代码,应该是更为可取的方式吧 使用起来非常简单,下面稍作说明: . 支持同步.异步 ...

  3. 2.Apache + Tomcat + mod_jk实现集群服务

    转自:http://www.cnblogs.com/dennisit/p/3370220.html Tomcat中的集群原理是通过组播的方式进行节点的查找并使用TCP连接进行会话的复制. 实现效果:用 ...

  4. 0010_while循环

    while 条件: 代码块 break:跳出循环语句 continue:跳出本次循环,进入下一次循环. __author__ = 'qq593' #!/usr/bin/env python #-*- ...

  5. Java探索之旅(12)——equals方法及其覆盖

    1.Object中的equals方法 java中的的基本数据类型:byte,short,char,int,long,float,double,boolean.==比较的是值. ❶作用:对于复合类型来说 ...

  6. 【PHP】composer 常用命令

  7. Android性能优化系列---管理你的app内存

     文章出处:http://developer.android.com/training/articles/memory.html#YourApp Random-access memory(RAM)在任 ...

  8. .frm和.ibd恢复数据

    昨日晚上开发告诉我不小心truncate两个表的数据,要求还原.结果在阿里云上找到了备份内容,结果是物理备份文件.frm..ibd.心中一万个草泥马啊..没办法,开始还原吧. 1.查看测试机Mysql ...

  9. 《OD大数据实战》Spark入门实例

    一.环境搭建 1. 编译spark 1.3.0 1)安装apache-maven-3.0.5 2)下载并解压 spark-1.3.0.tgz 3)修改make-distribution.sh  VER ...

  10. 洛谷P3258 [JLOI2014]松鼠的新家

    P3258 [JLOI2014]松鼠的新家 题目描述 松鼠的新家是一棵树,前几天刚刚装修了新家,新家有n个房间,并且有n-1根树枝连接,每个房间都可以相互到达,且俩个房间之间的路线都是唯一的.天哪,他 ...