开源了一个 html 转 pdf 的 js 库,这应该是 html 转 pdf 最正确的思路了

1 月 20 日
 lmq1919

大概的实现步骤:

1.解析 html 页面,生成一个包含节点位置信息,样式,层级,内容等信息的 DOM 树。

2.递归 DOM 树,根据节点据顶部的高度和生成页面规格的高度,将节点分配到不同的页面。

3.调用 jspdf.js 的 api,将节点绘制到 PDF 文件上。

优点:

1.生成的是矢量的 PDF ,可以对 PDF 的文本进行搜索,选中,编辑。

2.生成的文件体积很小

3.使用简单,一行代码即可将 html 页面转成 pdf

4.精准的分页,避免元素被切割。

5.如果文件体积不大,而且电脑性能支持,可以生成几千页的 PDF

  1. 具体的说明

https://juejin.cn/post/7583912637470769203

  1. 在线体验

https://dompdfjs.lisky.com.cn

  1. Git 仓库地址 (欢迎 Star⭐⭐⭐)

https://github.com/lmn1919/dompdf.js

7519 次点击
所在节点    程序员
51 条回复
lmq1919
1 月 22 日
@xmdbb edge 浏览器打开有点问题,可以试一下其他方式打开
xmdbb
1 月 22 日
@lmq1919 这个就有点头痛;
目前有些项目就是用 js-pdf 来导出,但是遇到表格分页的时候,就会导致文字直接砍断,或者表格直接截断。
而且也没办法要求客户使用这个或那个浏览器
lmq1919
1 月 22 日
@xmdbb 我现在在处理这个问题
lmq1919
1 月 22 日
@xmdbb 也不是所有情况都会这样,你可以先试一下
xmdbb
1 月 22 日
@lmq1919 哈哈,理解,接触过 js-pdf 后就知道有多不易,加油,期待哪天能薅你羊毛把 js-pdf 换成你的项目
oasis2008f
1 月 23 日
动态分页的问题真是太头痛了,尝试下你的方案
lmq1919
2 月 4 日
@xmdbb edge 浏览器现在也没问题了
applet
7 月 15 日
@evan1 #4 我也是无头浏览器方案,带图片、数学公式、页眉页脚,100 页基本 10 秒以内,已经能用了,楼主这个方案应该也能支持增加公式和图片,但是页眉页脚不知道好不好搞
lmq1919
7 月 16 日
@alphagao 页眉页脚可以支持自定义。其他需求可以去给我提个 issue,我慢慢去完善
wanniwa
7 月 29 日

好像会丢样式
lmq1919
7 月 29 日
@wanniwa 这个是 css 伪类的问题,没有处理好。预计下个版本解决

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://v2ex.ih06.com/t/1186972

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX