【问题标题】:Removing page breaks from puppeteer PDF?从 puppeteer PDF 中删除分页符?
【发布时间】:2020-10-14 20:27:35
【问题描述】:

我目前正在尝试查看是否有一种方法可以删除我的 puppeteer PDF 中的分页符,因为我当前的 PDF 设置中的一些分页符会以一种奇怪的方式截断文本。我在说什么的截图:

Screenshot

我的傀儡代码:

app.get("/:companyId/pdf", (req, res) => {
  (async () => {
    try {
      const browser = await puppeteer.launch({ args: ['--no-sandbox'] });
      const page = await browser.newPage();
      const url =
        process.env.WEBSITE_URL + `/${req.params.companyId}/report-internal`;
      await page.goto(url, { waitUntil: "networkidle0" });
      const buffer = await page.pdf({ format: "A4", printBackground: true });
      res.type("application/pdf");
      res.send(buffer);
      browser.close();
    } catch (error) {
      console.error(error);
      res.status(500).send("PDF cannot be generated.");
    }
  })();
});

是否可以使用 Puppeteer 生成一个长而连续的 PDF?那将是理想的。我尝试设置自定义 CSS 打印样式以防止在某些元素后出现分页符,但到目前为止,我还没有运气。非常感谢任何帮助。

编辑:我发现了一个不是最漂亮但有效的临时修复。我必须在 page.pdf 函数中手动定义文档的宽度和高度,如下所示:

const buffer = await page.pdf({ printBackground: true, width: 800, height: 3800 });

如果有更好的解决方法,那就太棒了。但万一有人偶然发现这一点,这对我有用。

【问题讨论】:

    标签: javascript node.js pdf pdf-generation puppeteer


    【解决方案1】:

    我尝试替代检测滚动元素,以便您的页面在打印为 PDF 时不会被截断,我希望这能如您所愿:

    const puppeteer = require('puppeteer')
    const url = 'https://en.wikipedia.org/wiki/COVID-19_pandemic'
    
    ;(async () => {
        const browser = await puppeteer.launch({
            headless: true,
            defaultViewport: {
                width: 1280,
                height: 800
            },
            userDataDir: './temp'
        })
        const [page] = await browser.pages()
        const pageResponse = await page.goto(url)
        const scrollDimension = await page.evaluate( () => {
            return {
                width: document.scrollingElement.scrollWidth,
                height: document.scrollingElement.scrollHeight
            }
        })
    //    const viewportSize = await page.evaluate( () => {
    //        return {
    //            width: Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0),
    //            height: Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0)
    //        }
    //    })
        await page.setViewport({
            width: scrollDimension.width,
            height: scrollDimension.height
        })
        const bufferPDF = await page.pdf({
            path: 'long.pdf',
            printBackground: true,
            width: scrollDimension.width,
            height: scrollDimension.height
        })
        const exit = await browser.close()
    })()
    

    【讨论】:

    • viewportSize 是干什么用的?
    • 你说得对,@cuadraman,它需要被删除。谢谢!
    猜你喜欢
    • 2013-09-03
    • 1970-01-01
    • 2011-11-10
    • 2023-03-26
    • 2023-01-24
    • 1970-01-01
    • 2023-04-10
    • 1970-01-01
    • 2015-03-10
    相关资源
    最近更新 更多