pdfobject.js和pdf.js的详解

最近的工作中遇到了很多坑，主要是因为最近做的报表，需要展示pdf文件，遇到很多问题，在这里我来一一描述下。
以下是大概遇到的问题描述：

使用的h5的embed标签展示pdf文件。ie那货却必须要装插件才能预览。简直恶心
经理让去掉打印和下载按钮，就是要自己控制浏览器的显示

第一个问题的解决

当时再网上查询了这种资料，决定将embed换成 PDFObject.js
然后就在github上下载pdfobject.js的源码。https://github.com/pipwerks/PDFObject ，将核心js pdfobject.js 引入到自己项目中。

<script type="text/javascript">

      window.onload = function (){
        var myPDF = new PDFObject({ url: "sample.pdf" }).embed();
      };

</script>

这个方法是拷过来的其实我使用中这个是不行的。
也可以查看官网中的example https://pdfobject.com/#examples 选择嵌入页面就查看
Embed two PDFs on one HTML page
官网信息
embed中可以添加参数。
这样就成功的引入了PDFObject.js并使用它显示了pdf。
（记住：对象PDFObject中的O是大写的）
使用简单的符号标识不同的标题，将某些文字标记为粗体或者斜体，创建一个链接等，详细语法参考帮助？。

第二个问题的解决

换成这个以后还是不能满足去掉打印和下载按钮的需求，所以接着换成了pdf.js
pdf.js的源码这里下载：http://mozilla.github.io/pdf.js/getting_started/#download
然后将整个项目引入你自己的项目中，中间试过action请求返回viewer.html页面，但是没走通，主要是因为他的file参数没法传递。
我在代码中添加了 iframe标签用来预览pdf，这时候又因为手误，造成了不必要的工作量， iframe 不能使用/关闭，必须是准确关闭。
然后就将对应的页面展示信息传递给iframe的src参数就可以了。

这里写图片描述

例如这样首相要保证你的src路径是正确的，你自己可以访问。这样就没啥问题了。
然后在viewer.html找到这两个按钮设置disable为none即可。

本文链接：https://blog.csdn.net/houyibing930920/article/details/78724520

智能推荐

PDF.js的简单使用

1.后端返回文件流，可在浏览器访问显示pdf的请求路径。例如：http://localhost:8081/showFile?path=C:/Users/lhl/Desktop/files/pdf/b3c39656ea744095bd9eb52d48c51803.pdf这个可以在浏览器显示pdf.... 直接的话是调用的window的p...

pdf.js的使用方法。

首先下载pdf.js。下载地址为：pdf.js 下载完成后将解压文件解压到一个新文件夹，名字随便命名就好。我这里命名为PDF.js 将你的解压文件放到你的网站根目录,并能够成功访问这个页面即可你要打印的pdf文件全部路径就是这个路径，这里以我的文件路径作为参考：http://localhost:8081/zkimp/PDF.js/web/viewer.html?file=http://loca...

PDF.JS的基本使用

网上下载的pdf.js的目录结构使用pdf.js浏览pdf 只需要修改viewer.js文件的pdf路径即可 var DEFAULT_URL = ‘xx.pdf’;(指定xx.pdf为默认打开文件) 但是我们在实际的使用过程中,是需要通过传值的方式灵活的选择pdf进行预览首先,把viewer.js的 DEFAULT_URL 改成空,修改为 http://localhos...

pdf.js分段加载

pdf.js默认是支持分段加载，大文件能减少打开时间。前端代码后端代码第一次请求状态是200，请求头不带range。后面是206，请求头带range...

PDF.js预览文件

网上找到很多前端实现文件预览方法，但都无法解决我的问题，产品需求中将文件上传到腾讯云的对象存储，返回一个URL，这个URL无法在网页中预览，浏览器将这个URL直接本地下载文件（下载文件下面说）,最后只能用PDF.js，这是一个开源的js库，直接将PDF文件渲染成canvas，PDF.js框架的魅力所在，为其为HTML5实现的，无需任何本地支持，而且对浏览器的兼容性也是比较好，要求只有一个：浏览器支...