有关前端和pdf相关的几件事

pdf（Portable Document Format的简称，意为“便携式文档格式”）

前端工做中，也避免不了要和pdf打交道，如下列一些相关的信息

预览pdf的方法

经过浏览器本身的能力

1. 直接<a href="pdf地址" >打开新的页面
2. iframe/object <iframe src="pdf地址">
3. embed <embed :src="previewUrl" type="application/pdf"

以上几种方法都存在跨域问题
固然其中pdf浏览器的样式都是浏览器自带的，若是想要自定义，可能会比较无力

经过相关的库

1. pdfobject 其实也是基于embed方案的
2. pdf.js pdfjs适用于自定义显示方案的，可是依赖webworker，兼容性可能不行

pdf.js

pdf.js 若是是经过npm安装的话，可能会遇到import相关的问题，这个时候改用pdfjs-dist/webpack就能够正常引入啦，不过包比较大，仍是建议使用cdn

生成pdf的方法

有经过前端/后端等多种方法，生成的pdf也分为纯图片/文字+图片的类型

经过后端

1. puppeteer 无头浏览器，网页生成pdf
2. jsPdf + html2canvas, 页面生成图片以后扔进jsPdf中
3. jsPdf, 纯js方案生成，缺点是须要本身计算每一个元素的位置
4. pdfmake 经过定义js对象来进行pdf,缺点是引入字体包致使整个依赖比较大，体验上比较好