做副业和做内容的人，迟早会碰上要导出 PDF 的需求。给客户发一份报价单、把网页上的报表存成文件、做个电子版简历或者合同模板，找在线工具转，要么限制页数，要么加个大水印，稍微用得频繁一点就得付费。这次整理的是 3 款开源免费、可商用的 PDF 处理库，能在浏览器里直接把内容生成和加工成 PDF，不依赖服务器，也不用买商业组件。
三款库分工不同
html2canvas 负责把网页上的元素拍成图片，它是很多一键导出功能的基础。jsPDF 是前端生成 PDF 的老牌库，文字、图片、表格、多页排版都支持，还能加页眉页脚和水印，做生成这类活儿主要靠它。pdf-lib 更擅长处理已有的 PDF，合并、拆分、填表单、加页码、加密这些它做起来最顺，偏加工而不是从零生成。三个搭配起来，日常能想到的 PDF 需求基本都能覆盖。
最常用的一套组合
最常见的做法是两步走。先用 html2canvas 把页面上你想要的那块区域转成图片，再把这张图片交给 jsPDF，按 A4 尺寸贴进去，一个一键导出的按钮就成了，代码量很少，网上也有大量例子可以参考。如果内容全是文字、需要可复制可搜索的 PDF，那就跳过截图，直接用 jsPDF 排版生成。需要在已有 PDF 上加东西的，用 pdf-lib 打开原文件再操作，比重新做一份省事得多。
中文乱码这个坑先说清楚
很多人第一次用 jsPDF 会发现中文变成乱码，这不是库坏了，是它默认字体里没有中文。两种解决办法，一种是注册一个支持中文的字体文件再用，另一种是先交给 html2canvas 把中文渲染成图片，再放进 PDF。前者生成的 PDF 文字还能选中复制，后者体积会大一些但最省事，按自己的需求选一种就行，踩过一次坑就记住了。
适合拿它做什么
做自媒体或者接单的人，可以用它把一个网页直接变成可下载的资料，给粉丝或者客户发出去；做工具类小程序的，用它在本地生成凭证、报表、清单，不用服务器也能跑；做电商的，订单确认单、发货单这类固定格式的文档，用模板加数据的方式批量生成，效率比手工高很多。整个流程都在浏览器里完成，用户点一下就能拿到文件，体验比跳转到第三方网站好得多。
资源在文末付费区下载，三款库分目录放好，压缩版和完整版都有，许可文件也一并附上。三个库都支持在浏览器直接引入，jsPDF 和 pdf-lib 还能跑在 Node 环境里，需要的话可以在服务器上批量生成。授权都是 MIT 协议，免费商用，保留各自的 LICENSE 文件即可，拿来做副业项目、给客户交付或者自己内部用都没问题，不用担心版权找上门。
暂无评论内容