如何根据HTML内容自动找到合适的PDF高度，以免在页面中产生无用的空白或遗漏内容？

如何解决如何根据HTML内容自动找到合适的PDF高度，以免在页面中产生无用的空白或遗漏内容？

(async () => {
    const baseUrl = 'example.com';
    const browser = await puppeteer.launch({ headless: true});
    const context = await browser.createIncognitoBrowserContext();
    const page = await context.newPage();

    function delay(time) {
        return new Promise(function (resolve) {
            setTimeout(resolve,time)
        });
    }

    await page.goto(baseUrl);
    await page.setViewport({
        width: 1200,height: 800
      });

    await page.waitForSelector('[name="loginfmt"]');
    await page.type('[name="loginfmt"]','[e-mail]');
    await page.click('[type="submit"]');
    delay(1000);
    await page.authenticate({ username: `[e-mail]`,password: `abc@123` });

    await delay(2000);
     async function autoScroll(page){
         await page.evaluate(async () => {
           await new Promise((resolve,reject) => {
              var totalHeight = 0;
              var distance = 10000;
               var timer = setInterval(() => {
                     var scrollHeight = document.body.scrollHeight;
                     window.scrollBy(0,distance);
                    totalHeight += distance;
    
                    if(totalHeight >= scrollHeight){
                         clearInterval(timer);
                        resolve();
                    }
                 },100);
            });
         })
     }
    await autoScroll(page);

    await delay(2000);
    await page.pdf(
        {
            path: "1.pdf",printBackground: true,}
    )

    browser.close();
})()

这是我从 GitHub 和 Stack Overflow 获得的关于页面自动滚动的方法。但是生成后我无法在我的pdf中获取整个页面。我想得到一个水平和垂直滚动的解决方案，这样我生成的 pdf 中就不会遗漏任何内容。

目前一直在使用下面的代码来获取完整的pdf。这不是获取 PDF 整页的动态方法，因为我手动给出了高度 15000px。 对于当前页面，它可以正常工作，但对于高度小于 15000px 的其他页面，它会导致末尾出现空白，这不是我们想要的方式。

await page.pdf(
        {
            path: "1.pdf",height: "15000px"
           
        }
    )

看看我们是否可以动态呈现整个页面的 height 和 width，以便我可以通过将它们存储在 {{1} 之前的变量中来将它们传递到 page.pdf } 这将正确给出单个页面的正确尺寸。

我一直在努力解决这个问题。如果我能解决这个问题，那真的很有帮助。

解决方法

页面的高度取决于页面 CSS。

当我们尝试给 "ctrl+P" 时，我们可以看到页面 CSS 是否默认支持自动滚动功能。

如果是，那么我们可以默认获取。

如果否，则必须更改页面 CSS 以支持自动滚动。