如何将html转化为pdf

html转换为pdf

1. html2pdf.js库，
   基于html2canvas和jspdf，只能打印2-3页pdf，比较慢，分页会截断
2. html2canvas
   只能打印2-3页pdf，比较慢，分页会截断 // canvas
3. Dom-to-image
   不支持某些css属性
4. Pdfmake html-to-pdfmake配合使用
   比较不错的库，有一些兼容性问题
5. wkhtmltopdf
   比较不错的库，基于webkit，支持性好，分页需要特殊处理，服务器需要安装wkhtmltopdf环境，但是转换之后会存在图表加载偏离，分页不均匀的问题
6. node+puppeteer（无头浏览器） // 直接打印
   比较不错的解决方案，是和直接鼠标右键打印另存为pdf是一个效果，但是会出现排版问题
   目前还没有找到好的解决方案

示例代码

wkhtmltopdf

首先在这里下载wkhtmltopdf，并且要记住文件的下载位置，下面时python的代码示例：

import pdfkit
import os

def html2pdf():
    folder_path = "report_output"

    # 获取文件夹中的文件名
    file_names = os.listdir(folder_path)

    # 存储文件名的列表
    file_list = []

    # 遍历文件名
    for file_name in file_names:
        # 检查文件名是否以 .html 结尾
        if file_name.endswith(".html"):
            # 将 .html 后缀替换为 .pdf
            pdf_file_name = file_name[:-5] + ".pdf"

            path_wkthmltopdf = r'C:\\Program Files\\wkhtmltopdf\\bin\\wkhtmltopdf.exe'
            config = pdfkit.configuration(wkhtmltopdf=path_wkthmltopdf)

            input_html = f"./report_output/{file_name}"  # 替换为你的 HTML 文件路径
            # 替换为你要保存的 PDF 文件路径
            output_pdf = f"./report_output_pdf/{pdf_file_name}"
            # 将 HTML 打印为 PDF
            pdfkit.from_file(input_html, output_pdf, configuration=config)
            file_list.append(pdf_file_name)
            print(f"{pdf_file_name}！", f" 这是第{len(file_list)}个报告")


if __name__ == "__main__":
    # 运行将本地 HTML 文件转换为 PDF 的函数
    html2pdf()

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

使用 puppeteer 进行html到pdf的转换

因为puppeteer是nodejs的一个库
要使用 Puppeteer 将当前页面转换为 PDF 文件，你可以按照以下步骤进行操作：

首先，确保你已经安装了 Puppeteer。你可以使用 npm 进行安装：

npm install puppeteer
1

在 JavaScript 文件中，引入 Puppeteer 并创建一个异步函数来处理 PDF 转换逻辑。以下是一个示例代码：

const puppeteer = require('puppeteer');

async function convertPageToPDF() {
  // 启动 Puppeteer
  const browser = await puppeteer.launch();

  // 创建一个新的页面
  const page = await browser.newPage();

  // 导航到指定的页面
  await page.goto('https://example.com');

  // 等待页面加载完成
  await page.waitForLoadState('networkidle0');

  // 将页面保存为 PDF 文件
  await page.pdf({ path: 'page.pdf', format: 'A4' });

  // 关闭浏览器
  await browser.close();

  console.log('PDF 文件已生成');
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

// 调用函数进行 PDF 转换

convertPageToPDF();
1

在上面的示例中，我们使用 puppeteer.launch() 启动了一个 Puppeteer 浏览器实例，然后通过 browser.newPage() 创建了一个新的页面。接下来，使用 page.goto() 导航到指定的页面，并使用 page.waitForLoadState() 等待页面加载完成。

一旦页面加载完成，我们使用 page.pdf() 将页面保存为 PDF 文件。在这个方法中，你可以指定保存的文件路径（path）和 PDF 的格式（format）。在示例中，我们将 PDF 格式设置为 A4。