如何在网站上使用JavaScript在现有PDF上添加文本？

我正在寻找一种使用JavaScript在现有PDF上添加文本的方法。 我设想它是一个用户点击一个按钮下载PDF，然后收到一个包含原始PDF和附加文本的文件

这有可能吗

重要的是要使用现有的PDF来保留其原始设计，并且PDF还包括以不同字体特别排版的文本和广泛的unicode字形

从网页生成此文本到PDF也很重要，因为生成的每个文本都会略有不同，从而为最终用户创建一个唯一的PDF

我一直在网上研究这个主题，并找到了jsPDF库，但它似乎只生成PDF，而不是在现有PDF之上编写，而且我需要的PDF内容太复杂，无法使用jsPDF生成所有内容。我不想使用现有的PDF作为背景图像，如果我没有必要的话

我还发现了一些像PDFKit这样的后端库，但如果可能的话，我希望避免使用后端库，而且它似乎也不会覆盖现有的PDF

我在网上看到了一些关于文本字段的内容，但很难理解这是否是一条可行的途径——是否可以在PDF中添加文本字段，然后在用户下载之前将文本插入网页中的这些字段

---

非常感谢。

PDF是只读的，因此创建后无法编辑，只能阅读。通过任何程序都无法做到这一点，更不用说Javascript了，除了使用创建第一个pdf的相同步骤从头开始生成pdf之外。

我想您可以将pdf文件转换为html，或者至少在画布上绘制它。如果可以，可以使用在现有html之上添加覆盖html以生成新的PDF文件

const pdfDoc = await PDFDocument.load(...)
const pages = pdfDoc.getPages()
pages[0].drawText('You can modify PDFs too!')
const pdfBytes = await pdfDoc.save()

var doc=new jsPDF（）；
doc.addHTML（document.body，function（））{
doc.text（20，20，“你好，世界！”）；
text（20，30，'这是客户端Javascript，输出PDF'）；
doc.addPage（）；
文本（20，20，‘你喜欢吗？’）；
printData（）；
});
printData=函数（）{
var str=doc.output（'datauristring'）；
console.log（str）；
//窗口打开（str）；可选
}

我的Pdf内容在这里

找到了此解决方案。很抱歉，但它确实涉及到在服务器端做一些工作。：）

它涉及

使用将pdf转换为html

根据需要操纵html。您可能可以使用更简单的dom操作

使用类似的方法将html转换回pdf

更多信息。

库支持修改现有PDF文件

const pdfDoc = await PDFDocument.load(...)
const pages = pdfDoc.getPages()
pages[0].drawText('You can modify PDFs too!')
const pdfBytes = await pdfDoc.save()

---

我在这方面没有经验，但首先想到的是像StackOverflow上使用的标记编辑器，用于格式化问题。它有用于生成PDF而不是html的插件，但它们可能需要服务器端脚本。我不知道有任何JavaScript库允许您这样做，但正如您所发现的，有很多服务器端库，它们工作得非常好，完全符合预期。iText（Java）和iTextSharp（.Net）是我个人知道的两个完全可以满足您的需求的工具。在我工作的地方，我们根据发送到Rails服务器的变量创建定制的.pdf报告。我可以看到类似的情况，将现有的.pdf和输入文本分层到一个合并的.pdf中。如果这是一个选项，我们可能会发疯。你是说你的要求是用javascript在浏览器中实现这一点吗？我已经完成了很多次，但我依靠我的服务器运行时来伪造它。（IIS，或在向用户输出最终pdf流之前执行的任何操作。）然后，可以使用服务器环境中的所有第三方工具，即使pdf位于服务器上且不受您的控制，您也可以通过添加pdf层和添加文本或图形来实现这一点。我通常会把它添加到一个新层。获取原始PDF DPI分辨率，不要假设所有PDF都具有相同的分辨率和比例。@taystack，在我的特殊情况下，LAMP（PHP）&我现在的做法是。在客户端通过JS生成图表，转换为画布，转换为BASE64，发送到服务器，服务器将BASE64转换为PNG。服务器使用TCPDF库+FPDI将现有PDF用作模板+在其上添加图像+文本，并将其发送回客户端。我希望摆脱疯狂，使用纯粹的JS方法。这不完全是真的。有许多程序和库允许您在现有PDF上标记额外内容。不过，我不知道现有的js代码是否允许这样做。为了进一步说明@mkl所说的话，直接从规范7.5.6增量更新：PDF文件的内容可以增量更新，而无需重写整个文件。我还进一步研究了这一点，并同意mkl和Chris Haas的观点。确实有很多方法可以在PDF上标记文本！谢谢你的帮助。这不是真的，有几个javascript库在他们的帮助下可以实现这一点。我在示例

TypeError:elements is null；elements=（elements.length）？元素：[元素]；html2canvas.js（第2660行，第9列）

。但是你是说如果我能将PDF转换成HTML，那么我就可以重用HTML，并使用上面的方法添加到其中？在我的例子中，PDF是一种基于矢量的CAD绘图，可以在任何放大倍数下缩放、查看或打印。将其转换为画布可能会被证明是不好的（我以前将这些图形作为图像文件，缩放时，它会出现不好的图像瑕疵），我想在我的情况下，如果我想要牵引力，我必须首先将有问题的PDF转换为其他内容。但是，到目前为止，即使采用这种方法，将其作为PDF保存也是“阻力最小”的途径