首页 > 解决方案 > Puppeteer 视口设置在创建 PDF 时无效

问题描述

我正在尝试使用 puppeteer 创建 PDF。创建 PDF 时设置视口根本没有效果。但是,视口设置确实适用于屏幕截图。过去似乎在 github 上发现了一些问题,但它们显然已被关闭。传入 defaultViewport: null 应该是解决方案。

这是我的代码:

browser = await chromium.puppeteer.launch({
    args: chromium.args,
    defaultViewport: null,
    executablePath: await chromium.executablePath,
    ignoreHTTPSErrors: true,
    headless: true,
});

let page = await browser.newPage();

// Set viewport
await page.setViewport({width: 1440, height: 900, deviceScaleFactor: 2});

// Generate pdf
const doc = await page.pdf(options);

我还尝试在启动时传递视口设置。

谢谢!

标签: javascriptnode.jspuppeteergoogle-chrome-headlesswebautomation

解决方案


page.pdf模拟“打印到 PDF”操作。这意味着两件事:首先是媒体打印,其次是您需要将特定格式或大小传递给pdf函数。

文档中:

width和选项接受标有单位的值heightmargin未标记的值被视为像素。

一些示例:
* page.pdf({width: 100})- 宽度设置为 100 像素的打印。
* page.pdf({width: '100px'})- 打印宽度设置为 100 像素。
* page.pdf({width: '10cm'})- 打印宽度设置为 10 厘米。

所有可能的单位是:
* px- 像素
* in- 英寸
* cm- 厘米
* mm- 毫米

format选项有:
* : 8.5in Letterx 11in
* Legal: 8.5in x 14in
* Tabloid: 11in x 17in
* Ledger: 17in x 11in
* A0: 33.1in x 46.8in
* A1: 23.4in x 33.1in
* A2: 16.54in x 23.4in
* A3: 11.7英寸 x 16.54 英寸
* A4:8.27 英寸 x 11.7 英寸
* A5:5.83 英寸 x 8.27 英寸
* A6:4.13 英寸 x 5.83 英寸


推荐阅读