最近接到产品需求，用户需要在我们的站点上在线查看 PDF 文件，并且查看时，用户可以对 PDF 文件的进行旋转、缩放、跳转到指定页码等操作。这个太简单了，随便找找就一堆轮子。

我们通常下载文件的方式无非后端给一个生成文件链接, 前端通过a标签或者iframe的方式去下载,这种方式的弊端是无法监测到文件是否下载完成,无法给用户友好的提示,以避免用户短时间内重复点击下载.

本文介绍在html中使用 pdfjs插件在线预览PDF文件的方法。到PDFJS官网下载pdfjs插件包，注意下载Stable稳定版的包。将下载的压缩包解压并放入项目中。在 iframe 标签中使用。

因此与原始的 React 页面相比，PDF 中应该有不同的样式和额外的内容。由于这个任务比用简单的 CSS 规则解决要复杂得多，所以我们先探讨了可能的实现方法。我们找到了 3 个主要解决方案。这篇博文将指导你了解它们的可能性并最终实施。

最近做项目中遇到要把整个页面保存为PDF文件，网上找了一下实现的方法都是 html2canvas.js+jsPdf.js 来实现。实现的过程是 先用html2canvas.js把html页面转成图片，再用jsPdf.js把图片导出为pdf。

pdf.js是一款开源的pdf文档读取解析插件，据说在HTML5下诞生的，对于主流的浏览器基本都支持。pdf.js主要包含两个库文件，一个pdf.js和一个pdf.worker.js，，一个负责API解析，一个负责核心解析。