刚好遇到需求，需要在手机端--展示一个电子收据，电子收据返回是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. delphi 线程教学第三节：设计一个有生命力的工作线程

    第三节:设计一个有生命力的工作线程   创建一个线程,用完即扔.相信很多初学者都曾这样使用过. 频繁创建释放线程,会浪费大量资源的,不科学.   1.如何让多线程能多次被复用?   关键是不让代码退出 ...

  2. C语言32关键字

    关键字 说明 auto 声明自动变量 short 声明短整型变量或函数 int 声明整型变量或函数 long 声明长整型变量或函数 float 声明浮点型变量或函数 double 声明双精度变量或函数 ...

  3. Impala介绍

    Impala介绍 Impala支持的文件格式 Impala可以对Hadoop中大多数格式的文件进行查询.它能通过create table和insert的方式将一部分格式的数据加载到table中,但值得 ...

  4. 在linux系统个人目录下安装新版python

    一.下载所需的python版本文件 在linux个人目录下 下载https://www.python.org/ftp/python/3.5.4/Python-3.5.4.tar.xz 解压tar.xz ...

  5. C++中struct和class定义类区别

    有一种常见的误解认为用struct保留字定义的类与用class定义的类有很大的区别.唯一的不同只是默认的成员保护级别和默认的派生保护级别,没有其他的区别. 1. 用class定义的类,默认的成员访问级 ...

  6. html5增强的页面元素

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. Struts2 源码分析-----拦截器源码解析 --- ParametersInterceptor

    ParametersInterceptor拦截器其主要功能是把ActionContext中的请求参数设置到ValueStack中,如果栈顶是当前Action则把请求参数设置到了Action中,如果栈顶 ...

  8. vue -- 项目调试

    方式1:vue-devtools插件 vue-devtools是一款基于chrome游览器的插件,用于调试vue应用,这可以极大地提高我们的调试效率. 使用步骤 1. 到github下载:https: ...

  9. 洛谷P3006 [USACO11JAN]瓶颈Bottleneck（堆模拟）

    传送门 感觉这题的思路还是挺不错的.然而为啥全网就一个题解而且只有代码……然后我只好看着代码理解了好久…… 题意就是有一棵树,每一个节点向他父亲节点连边,且有一个容量表示每一秒可以经过的牛的数量,每一 ...

  10. 41.QT-多线程与界面之间交互总结

    1. 线程与界面组件需要注意的地方 在QThread线程中不能直接创建QWidget之类的界面组件. 因为在QT中,所有界面组件相关的操作都必须在主线程中(也就是GUI thread) 所以, QTh ...