使用JavaScript生成PDF文件


268

我试图将XML数据从网页转换为PDF文件,希望能完全在JavaScript中完成。我需要能够绘制文本,图像和简单形状。我希望能够完全在浏览器中做到这一点。

Answers:


446

我刚刚编写了一个名为jsPDF的库,该库仅使用Javascript 即可生成PDF。它仍然很年轻,我将很快添加功能和错误修复。还为不支持数据URI的浏览器中的解决方法提供了一些建议。它是根据MIT的宽松许可证获得许可的。

在开始写这个问题之前,我遇到了这个问题,并以为我会回来告诉你:)

用JavaScript生成PDF

示例创建一个“ Hello World” PDF文件。

// Default export is a4 paper, portrait, using milimeters for units
var doc = new jsPDF()

doc.text('Hello world!', 10, 10)
doc.save('a4.pdf')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.debug.js"></script>


10
我是否部分启发了jsPDF?在您宣布jsPDF的那一天,我就了解了它。到目前为止看起来很棒。我最终选择了Prawn,因为它很容易满足我的需求,是最好的PDF生成库。我仍然很乐意在浏览器中完成所有工作,因为我不太肯定会在要部署到的系统上安装Ruby。我正在密切关注jsPDF。我很乐意提供帮助,但是我的时间非常有限。将来可能会改变。
变形虫

7
您的确启发了它:),我在Internet上四处看看是否已经存在,发现有些人会发现它很有用。让我知道您是否想帮忙。我是Twitter上的@MrRio。
詹姆斯·霍尔

23
它仍然非常活跃。0.9.0rc2今天发布。
James Hall

87
@JamesHall,我要感谢您编写此书必须付出的所有工作,并感谢MIT许可它使您可以为自己的利益进行商业化而使世界变得更美好。
查尔斯·伯恩斯

16
下选民可以为我们提供“更好”的想法或解决方案吗?这是一项出色的工作。
OnurYıldırım2015年

138

另一个值得一提的javascript库是pdfmake

浏览器支持似乎不如jsPDF强大,似乎也没有形状选项,但是与jsPDF当前可用的选项相比,用于格式化文本的选项更高级。


7
这个答案应该更多,pdfmake比jspdf健壮得多。但是,仅需注意,它是PDFKit库的包装。
vittore 2015年

2
另外请注意,jspdf不支持utf-8,而pdfmake仅默认字体支持utf-8。
狮子座

“ pdfmake.min.js-0.1.22-9小时前”它尚未死,已于今天更新。
zenbeni '16

通过比较这两个方面,对我来说,似乎jsPDF更加针对“图形” PDF创建,而pdfmake更加针对于生成格式正确的“纯文本”文档,对于通用文本格式似乎有更多的选择。
cslotty

这是IE友好的吗?
Wildhammer

59

我维护PDFKit,它也为pdfmake提供支持(已经在此处提到)。它可以在Node和浏览器中运行,并且支持其他库无法提供的许多功能:

  • 嵌入子集字体,并支持unicode。
  • 许多高级文本布局的东西(列,分页符,完整的unicode换行符,基本的RTF等)。
  • 为高级字体(OpenType / AAT连字,上下文替换等)处理更多字体。即将推出:如果您有兴趣,请参见fontkit分支。
  • 更多图形内容:渐变等。
  • 使用Browserify和Streams等现代工具构建。在浏览器和节点中均可用。

查看http://pdfkit.org/以获得完整的教程,亲自了解PDFKit可以做什么。并举例说明可以生成哪些类型的文档,请使用PDFKit本身从某些Markdown文件生成的PDF格式签出文档:http ://pdfkit.org/docs/guide.pdf 。

您也可以在以下浏览器中以交互方式进行尝试:http : //pdfkit.org/demo/browser.html


这不是服务器端库吗?我认为讨论是在客户端js库上进行的。
Ash Catchem

10
如答案中所述,PDFKit可在Node和浏览器中使用。请参阅浏览器演示的链接。
devongovett

这会压缩图像吗?我正在开发一个功能与camscanner相似的Web应用程序,并且正在寻找通过JavaScript创建PDF以利用压缩和多页格式的功能。
Trevor

@devongovett,您可以看看我有关您的图书馆的问题吗?
ninbit

8

另一个有趣的项目是texlive.js

它允许您在浏览器中将(La)TeX编译为PDF。


hello world示例可以很好地渲染,但是大约需要30秒钟才能完成。
Sam Sippe'7

2

您可以通过添加一个从任何URL创建pdf的链接(例如http://www.phys.org)来使用此免费服务:

http://freehtmltopdf.com/?convert=http%3A%2F%2Fwww.phys.org&size=US_Letter&orientation=portrait&framesize=800&language=zh-CN


1
更新:当我去检查这个freehtmltopdf.com服务时,它说它不再可用。听起来真是太神奇了!
Mark Duiker '16

现在检查-有效。令人惊讶的是,我使用的服务是我为每个pdf付费,并且需要编写代码,这是一个解决问题的方法。
谢尔盖·索布

-29

即使可以使用JavaScript生成PDF内存中的内存,也仍然存在如何将数据传输给用户的问题。JavaScript很难仅向用户推送文件。

为了将文件提供给用户,您需要进行服务器提交,以使浏览器显示保存对话框。

话虽如此,生成PDF确实并不难。只需阅读规格。


1
这一点都不困难,例如,它似乎可以与Data-URIs一起使用en.wikipedia.org/wiki/Data_URI_scheme(我以前做过,但是我不记得我是否使用过Data-URIs)。
比约恩

58
这些天,您可以轻松地使用JavaScript创建文件。(我来自未来)
德里克·朕会功夫2014年

5
如今真的很简单..例如:github.com/ChenWenBrian/FileSaver.js
roy riojas 2014年

9
@FrankKrueger如果您删除答案,您将获得6分:P
KamilKiełczewski16年

8
@FrankKreuger,“阅读规范”几乎永远不是正确的答案。
克里希南(Krishnan Venkiteswaran)'18年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.