使用 puppeteer 打印 `one_long_page` pdf答案

【问题标题】：Print `one_long_page` pdf using puppeteer使用 puppeteer 打印 `one_long_page` pdf
【发布时间】：2020-05-10 12:12:51
【问题描述】：

我想将this resume site 打印到 pdf 的 1 页内使用 puppeteer，所需的结果类似于 this，所需的结果使用了 @ 987654323@，pageSize 选项设置为one_long_page（默认情况下）。 one_long_page 的 pageSize 确实是我想要的，但我不知道如何在 puppeteer 中实现。请参阅 Seija documentation 以查看该选项。

Here 是使用 Seija 将 html 转换为 pdf 的脚本（有效）。

这是我目前的 puppeteer 尝试：（您可以在此处不安装 puppeteer 在线尝试：https://try-puppeteer.appspot.com/）

const puppeteer = require('puppeteer')

;(async () => {
  const browser = await puppeteer.launch()
  const page = await browser.newPage()

  await page.goto('https://nearhuscarl.github.io/portfolio/resume-full', {
    waitUntil: 'networkidle2'
  })

  const [width, height] = await page.evaluate(
    () => [
      document.documentElement.offsetWidth, 
      document.documentElement.offsetHeight
    ]
  )

  console.log(width, height)

  // await page.addStyleTag({
  //   content: `@page { size: auto; }`
  // })

  await page.pdf({
    path: 'near_resume.pdf',
    printBackground: true,
    // scale: 0.98,
    // pageRanges: '1',
    // height: pageHeight,
    // preferCSSPageSize: true,
    width,
    height,
    // margin: { top: 0, right: 0, bottom: 0, left: 0 }
  })

  await browser.close()
})()

当前结果：

【问题讨论】：

标签： javascript puppeteer

【解决方案1】：

这是我想出的代码，它几乎可以工作，其中包含很多技巧。找不到像pageSize: one_long_page 这样的简单解决方案，即使它看起来如此微不足道。

const puppeteer = require('puppeteer')

const url = 'https://nearhuscarl.github.io/portfolio/resume-full'
const viewportWidth = 1000
const output = 'near_resume.pdf'

;(async () => {
  const browser = await puppeteer.launch({
    defaultViewport: { 
      width: +viewportWidth + 1, // THE HACK to make it work
      height: 0 
    }
  })

  const page = await browser.newPage()
  await page.goto(url, {
    waitUntil: 'networkidle2'
  })

  const [width, height] = await page.evaluate(() => [
    document.documentElement.offsetWidth, 
    document.documentElement.offsetHeight
  ])

  console.log(width, height)

  await page.pdf({
    path: output,
    printBackground: true,
    pageRanges: '1', // THE HACK to make it work
    height: +height + 1, // THE HACK to make it pixel-perfect
  })

  await browser.close()
})()

【讨论】：