如何专门为 Chrome 扩展程序使用 jsPDF 库？
对于我的 Chrome 扩展程序，我想为用户提供一个下载 PDF 的选项，该 PDF 会为他们显示和格式化数据。这个想法是，用户按下扩展程序弹出窗口上的按钮，扩展程序会生成 PDF，然后浏览器会下载 PDF。
到目前为止，我尝试使用 jsPDF（
https://github.com/parallax/jsPDF
），但收效甚微。我按照他们的程序在我的弹出 HTML 文件 (popup.html) 中的脚本标记
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
中从 CDN 加载，并在弹出脚本 (popup.js) 中写入相关的导入语句
import {jsPDF} from "jspdf";
。
当我运行扩展程序时，出现两个错误。
- 拒绝加载脚本“https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js”，因为它违反了以下内容安全策略指令：“script-src 'self'”。请注意，未明确设置“script-src-elem”，因此使用“script-src”作为后备。
另一篇文章（
Chrome 扩展“Script-src”错误（自我学习）
）中的评论建议通过在清单文件中添加
“content_security_policy”：“script-src 'self' https://example.com; object-src 'self'”
作为新键来解决此问题。我尝试了此操作 — 并确保将 url 更改为前面提到的脚本标记中的 url — 但错误仍然存在。
- 未捕获的语法错误：无法在模块外使用导入语句
另一篇文章 ( Chrome 扩展“Script-src”错误（自学） ) 提出了解决此问题的建议；实施此更改后，我收到的错误是： 未捕获的类型错误：无法解构“window.jspdf”的属性“jsPDF”，因为它未定义。
我在网上广泛查找了有关如何在 Chrome 扩展程序中使用 jsPDF 等库的参考资料。大多数都详细解释了如何在 Node 中使用此类库。但很少有关于浏览器使用（特别是 Chrome 扩展程序使用）的详细信息。
将其添加到 javascript 文件的顶部：
const { jsPDF } = window.jspdf;
如果您在浏览器扩展程序中遇到 jsPDF 问题，可以使用最新版本的 jsPDF 来简化解决方案：
- 将 jsPDF 脚本包含在扩展程序的清单中。
- 将 jsPDF 脚本注入到扩展程序运行的网页中。
- 确保脚本已完全加载，然后再继续。
-
使用以下命令在脚本中初始化 jsPDF：
const doc = new jspdf.jsPDF();
此方法应能解决浏览器扩展程序中典型的 jsPDF 集成问题。 自 2024 年 1 月 8 日起，此方法应能奏效