持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第20天,点击查看活动详情
PDF 代表可移植文档格式。PDF 是 Adobe 在 90 年代为 Windows 设计的。它们是独立的文档,支持几乎所有主要操作系统。
但有时你需要修改 PDF 以满足你的需要,而不仅仅是查看它。不幸的是,适用于 PDF 的可用软件通常无法满足你的专业要求。
但你是程序员,对吧?为什么不制作一些软件来帮助 PDF 按你的意愿工作呢?嗯,这就是这篇文章的灵感。
在本文中,我们将探索 JavaScript 中所有流行的与 PDF 相关的库。为什么选择 JavaScript?因为它有一些相当不错的 PDF 包可用,而且人们喜欢它。尤其是我自己。
我们将在本教程中做什么:
- 首先,我们将探索一些流行的 PDF 包,用于在 JavaScript 中进行与 PDF 相关的工作。然后我们将比较它们并找到最适合我们要求的包。
- 接下来,我们将加载现有的 PDF 并从中提取一些页面。提取的页面将创建一个新的 PDF 文档。
- 然后我们将在浏览器中渲染新的 PDF(我们在第二步中制作的)。
- 最后,我们将下载新的 PDF 供以后使用。
所以这些是我们将在这里完成的所有步骤。我希望你很高兴看到结果。让我们潜入水中。
JavaScript 的 PDF 库
我在 JavaScript 中发现了两种主要类型的 PDF 库。一种用于 PDF 渲染,另一种用于 PDF 操作(或修改)。在搜索了一个小时左右后,我找到了一堆 PDF 库,这些是我最好的选择。
此处列出的所有软件包都是免费的开源软件包。你可以在 npm 注册表中找到所有这些包。
pdfjs
该软件包由 Firefox 网络浏览器背后的公司 Mozilla 制作。pdfjs 是一个基于 Web 标准的解析和呈现 PDF 的平台。 当你在 Firefox 中查看 PDF 时,PDF 查看器是使用此 pdfjs 包制作的。
这个包的核心优势是在网页上呈现 PDF。此软件包的其他 PDF 修改功能非常有限。如果你想为你的站点制作自定义 PDF 查看器,可能这就是你正在搜索的包。
pdfjs 有一个非常简单的 API。他们有很多关于图书馆入门的教程。如果你还不够信服,就玩这个库一段时间,你一定会爱上它。
pdf-lib
与之前的 pdfjs 包不同,pdf-lib 主要用于 PDF 创建和操作。你可以根据需要使用此包动态生成新的 PDF 文档。
该软件包对修改现有文档具有强大的支持。你可以使用此库进行大量 PDF 修改。例如,你可以进行 PDF 拆分和合并,你可以提取页面、注释 pdf 文档、添加大纲以及更多你可以想象的事情。
它只有 JavaScript 作为依赖项。因此,它可以在任何具有 JavaScript 运行时的设备上运行。浏览器、Nodejs、Deno 和 React Native 都得到了很好的支持。如果你能设法在设备上安装 JavaScript,那么这个库肯定可以工作。
pdf-lib 的主要缺点是它没有强大的渲染支持。如果你想用这个库为 pdf 查看创建一个漂亮的 UI,那么 pdf-lib 不是你的正确选择。在这种情况下,你应该改用 pdfjs。
pdfjs #2
如果你认为我在重复自己,那么我不是。这是一个用于创建 PDF 文档的 JavaScript 库。它有一个非常简单的 API 可以使用。
我们之前讨论过的 pdfjs 库在 UI 中具有非常强大的渲染支持,但它缺乏 PDF 创建和修改功能。
但是这个库是在创建 PDF 的基础上构建的。它有一个非常简单的 API,对初学者很友好。你可以将其与 pdf-lib 包进行比较。
这个 pdfjs 库的主要缺点是对修改现有文档的支持仍处于 beta 阶段。它并非一直有效,并且仍在进行中。
如果你主要关注 PDF 修改(例如,页面提取、合并、拆分、注释等),那么此库可能不适合你。
如果贡献者可以使修改功能起作用,那么这可能是 JavaScript 的最佳 PDF 包。
js-pdf
与上面列出的所有 PDF 包不同,这个库是一个完整的野兽。你可以使用此库进行任何与 PDF 相关的工作。这就像一个万事通图书馆。如果你想要一些复杂的 PDF 相关的东西,那么这个库可以做到。
但是 JavaScript 中有更好的包,它们非常适合单独的任务。例如 pdfjs 是比 js-pdf 更好的 PDF 渲染器,而 pdf-lib 比 js-pdf 具有更好的修改支持。
在这里,我不是在谈论实际性能或其他类型的指标,而是在谈论开发人员体验。我发现它的 API 不是很直观。对于初学者来说,乍一看可能会让人不知所措。不过,这是我的观点,也是我使用它时的经历。
PDF 生成是这个库的主要优势。你可以使用你拥有的任何设计生成任何类型的 PDF。这个包裹将为你完成所有繁重的工作。如果你有经验,那么这可能是你的最佳选择。
反应-pdf
顾名思义,这个库专门用于 React 生态系统。用法非常React-ish。你可以使用类似 JSX 的语法轻松创建文档。
你可以使用简单的 React 组件创建和显示 PDF 文档。但是功能非常有限。该库主要用于 PDF 生成。
如果你的目标是向用户显示 PDF,那么你可以使用此包。作为 React 爱好者,你会喜欢这个库。看看他们的游乐场并花一些时间使用这个包。这样你就会知道你是否需要这个库。
为什么我们将在本教程中使用 pdf-lib
在上面提到的所有这些 PDF 库中,我将在本文中使用 pdf-lib。由于我们要拆分和合并 PDF 页面并在浏览器中呈现它们,所以 pdf-lib 似乎是这种情况下的最佳选择。
此外,pdf-lib 有一个非常简单的 API 可以使用,并且所有这些 API 都有很好的文档记录。如果你使用的是 TypeScript,你还可以获得类型推断,这非常有帮助。
最后但同样重要的是,他们的例子非常好。你可以在几分钟内启动并运行。所以我喜欢这个库用于我的用例。