parallax/jsPDF

#  [](https://github.com/MrRio/jsPDF/actions/workflows/continuous-integration.yml?query=branch%3Amaster) [](https://codeclimate.com/repos/57f943855cdc43705e00592f/feed) [](https://codeclimate.com/repos/57f943855cdc43705e00592f/coverage) [](https://github.com/MrRio/jsPDF/blob/master/LICENSE) [](https://lgtm.com/projects/g/MrRio/jsPDF/alerts/) [](https://lgtm.com/projects/g/MrRio/jsPDF/context:javascript) [](https://gitpod.io/from-referrer/) **一个用于生成 PDF 的 JavaScript 库。** 你可以通过 [Twitter 联系我](http://twitter.com/MrRio)：[@MrRio](http://twitter.com/MrRio)，或者访问 [我公司的网站](http://parall.ax) 进行咨询。 jsPDF 现由 [yWorks - 图表专家](https://www.yworks.com/) 共同维护。 ## [在线演示](http://raw.githack.com/MrRio/jsPDF/master/) | [文档](http://raw.githack.com/MrRio/jsPDF/master/docs/) ## 安装 推荐方式：从 npm 获取 jsPDF： ``` npm install jspdf --save # 或 yarn add jspdf ``` 或者始终通过 [unpkg](https://unpkg.com/browse/jspdf/) 获取最新版本 ``` ``` 此包的 `dist` 文件夹包含不同类型的文件： - **jspdf.es.\*.js**：现代 ES2015 模块格式。 - **jspdf.node.\*.js**：用于在 Node 中运行。使用文件操作而不是浏览器 API 来加载/保存文件。 - **jspdf.umd.\*.js**：UMD 模块格式。用于 AMD 或 script 标签加载。 - **polyfills\*.js**：旧版浏览器（如 Internet Explorer）所需的 polyfill。es 变体简单地从 `core-js` 导入所有 所需的 polyfill，umd 变体则是自包含的。 通常不需要在 import 语句中指定确切的文件。构建工具或 Node 会自动找出 正确的文件，因此只需导入 "jspdf" 即可。 ## 使用方法 然后你就可以开始制作你的文档了： ``` import { jsPDF } from "jspdf"; // Default export is a4 paper, portrait, using millimeters for units const doc = new jsPDF(); doc.text("Hello world!", 10, 10); doc.save("a4.pdf"); ``` 如果你想更改纸张大小、方向或单位，可以这样做： ``` // Landscape export, 2×4 inches const doc = new jsPDF({ orientation: "landscape", unit: "in", format: [4, 2] }); doc.text("Hello world!", 1, 1); doc.save("two-by-four.pdf"); ``` ### 在 Node.js 中运行 ``` const { jsPDF } = require("jspdf"); // will automatically load the node version const doc = new jsPDF(); doc.text("Hello world!", 10, 10); doc.save("a4.pdf"); // will save the file in the current working directory ``` ### 其他模块格式

AMD

``` require(["jspdf"], ({ jsPDF }) => { const doc = new jsPDF(); doc.text("Hello world!", 10, 10); doc.save("a4.pdf"); }); ```

全局变量 (Globals)

``` const { jsPDF } = window.jspdf; const doc = new jsPDF(); doc.text("Hello world!", 10, 10); doc.save("a4.pdf"); ```

## 安全 我们强烈建议在将用户输入传递给 jsPDF 之前对其进行净化处理！ 如需报告安全漏洞，请参阅 [SECURITY.md](https://github.com/parallax/jsPDF/blob/master/SECURITY.md)。 ### 在 Node 上读取本地文件系统中的文件 在 Node.js 下运行时，jsPDF 默认会限制从本地文件系统读取文件。 强烈推荐：使用 Node 的权限标志，以便运行时强制执行访问控制： ``` node --permission --allow-fs-read=... ./scripts/generate.js ``` 详情请参阅 [Node 文档](https://nodejs.org/api/permissions.html)。请注意，你需要在 `--allow-fs-read` 标志中包含 所有导入的 JavaScript 文件（包括所有依赖项）。 回退方案（不推荐）：你可以通过在脚本中设置 `jsPDF.allowFsRead` 来允许 jsPDF 读取特定文件。 ``` import { jsPDF } from "jspdf"; const doc = new jsPDF(); doc.allowFsRead = ["./fonts/*", "./images/logo.png"]; // allow everything under ./fonts and a single file ``` 警告：我们强烈推荐使用 Node 标志而不是 `jsPDF.allowFsRead`，因为标志由运行时强制执行，并提供更强的安全性。 ### 可选依赖 jsPDF 的某些功能需要可选依赖。例如，`html` 方法依赖于 `html2canvas`，并且 当提供字符串 HTML 文档时，还依赖于 `dompurify`。JsPDF 会在需要时动态加载它们 （使用相应的模块格式，例如动态导入）。像 Webpack 这样的构建工具会自动为每个可选依赖 创建单独的 chunk。如果你的应用程序不使用任何可选依赖，你可以通过将它们定义为外部依赖来防止 Webpack 生成 chunk： ``` // webpack.config.js module.exports = { // ... externals: { // only define the dependencies you are NOT using as externals! canvg: "canvg", html2canvas: "html2canvas", dompurify: "dompurify" } }; ``` 在 **Vue CLI** 项目中，可以通过 `vue.config.js` 文件的 [configureWebpack](https://cli.vuejs.org/config/#configurewebpack) 或 [chainWebpack](https://cli.vuejs.org/config/#chainwebpack) 属性定义外部依赖 （在新建项目中，需要先创建该文件）。 在 **Angular** 项目中，可以使用 [custom webpack builders](https://github.com/just-jeb/angular-builders/tree/master/packages/custom-webpack) 定义外部依赖。 在 **React** (`create-react-app`) 项目中，可以通过使用 [react-app-rewired](https://github.com/timarney/react-app-rewired) 或 ejecting 来定义外部依赖。 ### TypeScript/Angular/Webpack/React 等配置： jsPDF 可以像任何其他第三方库一样导入。这适用于所有主要的工具包和框架。jsPDF 还为 TypeScript 项目提供了类型定义文件。 ``` import { jsPDF } from "jspdf"; ``` 你可以按如下方式将 jsPDF 添加到你的 meteor-project 中： ``` meteor add jspdf:core ``` ### Polyfills jsPDF 需要现代浏览器 API 才能运行。要在 Internet Explorer 等旧版浏览器中使用 jsPDF， 需要 polyfill。你可以按如下方式加载所有必需的 polyfill： ``` import "jspdf/dist/polyfills.es.js"; ``` 或者，你可以加载预打包的 polyfill 文件。不建议这样做，因为你可能会 多次加载 polyfill。但对于小型应用程序或快速 POC 可能仍然很方便。 ## Unicode 字符 / UTF-8 的使用： PDF 中的 14 种标准字体仅限于 ASCII 代码页。如果你想使用 UTF-8，你必须集成一个 提供所需字形 (glyphs) 的自定义字体。jsPDF 支持 .ttf 文件。因此，如果你想在 pdf 中包含例如 中文文本，你的字体必须包含必要的汉字字形。因此，请检查你的字体是否支持 所需的字形，否则将显示乱码而不是正确的文本。 要向 jsPDF 添加字体，请使用我们的字体转换器 [/fontconverter/fontconverter.html](https://rawgit.com/MrRio/jsPDF/master/fontconverter/fontconverter.html)。 fontconverter 将创建一个 js 文件，其中包含提供的 ttf 文件内容作为 base64 编码字符串 以及 jsPDF 的附加代码。你只需将此生成的 js 文件添加到你的项目中。 然后你就可以在代码中使用 setFont 方法并编写 UTF-8 编码的文本了。 或者，你可以使用 `fetch` 或 `XMLHttpRequest` 将 *.ttf 文件的内容作为二进制字符串加载，并 将字体添加到 PDF 文件中： ``` const doc = new jsPDF(); const myFont = ... // load the *.ttf font file as binary string // add the font to jsPDF doc.addFileToVFS("MyFont.ttf", myFont); doc.addFont("MyFont.ttf", "MyFont", "normal"); doc.setFont("MyFont"); ``` ## 高级功能 自从与 [yWorks fork](https://github.com/yWorks/jsPDF) 合并以来，有许多新功能。然而，其中一些 具有破坏性的 API 变更，这就是为什么在两种 API 模式之间存在一个 API 开关： - 在 "compat" API 模式下，jsPDF 具有与 MrRio 原始版本相同的 API，这意味着与插件的完全兼容性。 但是，一些高级功能（如变换矩阵和图案）将无法工作。这是默认模式。 - 在 "advanced" API 模式下，jsPDF 具有你从 yWorks fork 版本中习惯的 API。这意味着 所有高级功能的可用性，如图案、FormObjects 和变换矩阵。 你可以通过调用来在两种模式之间切换 ``` doc.advancedAPI(doc => { // your code }); // or doc.compatAPI(doc => { // your code }); ``` JsPDF 将在回调运行后自动切换回原始 API 模式。 ## 支持 请在 Stackoverflow 上检查你的问题是否已被处理。 随意在那里使用 `jspdf` 标签提问。 非常欢迎提交功能请求、错误报告等作为 issues。请注意，错误报告应遵循以下准则： - 错误应作为 [mcve](https://stackoverflow.com/help/mcve) 报告 - 确保代码正确缩进并[格式化](https://help.github.com/articles/basic-writing-and-formatting-syntax/#quoting-code)（在代码块周围使用 ```） - 提供一个可运行的示例。 - 尽量确保并在你的 issue 中表明该问题实际上与 jspdf 有关，而不是你选择的框架。 ## 许可证 (MIT) 版权 (c) 2010-2025 James Hall, https://github.com/MrRio/jsPDF (c) 2015-2025 yWorks GmbH, https://www.yworks.com/ 特此免费授予任何获得本软件副本和相关文档文件（“软件”）的人不受限制地处置该软件的权利，包括不受限制地使用、复制、修改、合并、发布、分发、再授权和/或出售该软件副本的权利，以及再授权给配备了这些软件的人的权利，但须符合以下条件： 上述版权声明和本许可声明应包含在该软件的所有副本或实质性成分中。 本软件按“原样”提供，不提供任何形式的保证，无论是明示或暗示的，包括但不限于适销性、特定用途适用性和非侵权性的保证。在任何情况下，作者或版权持有人均不对任何索赔、损害或其他责任负责，无论是在合同诉讼、侵权行为还是其他方面，由本软件或本软件的使用或其他交易引起、与之相关或与之相关。

标签：CMS安全, HTML转PDF, JavaScript, jsPDF, MITM代理, npm包, PDF生成, Syscall, Web开发, 客户端生成, 开源库, 报表生成, 搜索引擎爬虫, 数据可视化, 文件导出, 文档处理, 无后端, 自定义脚本, 自定义脚本