javascript - Puppeteer:page.screenshot 调整视口(viewport)大小

标签 javascript puppeteer

我是 puppeteer 师的新手,如果这是一个菜鸟错误,请原谅。
puppeteer 版本:6.0.0/9.0.0/10.0.0
我正在使用 headless:false 中的 puppeteer 进行页面截图。模式。有一秒钟的闪烁,视口(viewport)似乎在截取屏幕截图的那一刻调整了大小(几乎缩小了一半),然后我们又回到了全尺寸,直到下一个屏幕截图。
这些是我的相关代码位:

const browser = await puppeteer.launch({
        args: ['--disable-features=site-per-process'],
        ignoreDefaultArgs: ["--hide-scrollbars"],
        headless: false
    });
...

await page.setViewport({
        width: 1000,
        height: 500,
        deviceScaleFactor: 1
    });
...

await page.screenshot({
            encoding: "base64",
            captureBeyondViewport: false
        });
我在网上发现了这个问题,他们声称如果你设置 captureBeyondViewport: false 已经解决了这个问题: https://github.com/puppeteer/puppeteer/issues/7043
我已经用三个不同版本的 puppeteer 进行了测试(见上文)。闪烁的行为无处不在。我在这里做错了什么吗?

最佳答案

对我来说,仅当我同时设置 captureBeyondViewport: false 时才停止调整大小。在 page.screenshotdefaultViewport: nullpuppeteer.launch这是没有任何屏幕截图调整大小的完整代码:

const puppeteer = require('puppeteer');

const wait = (time) => new Promise(function (resolve) { setTimeout(resolve, time) });

(async () => {
  const browser = await puppeteer.launch({args: ['--no-sandbox', '--disable-setuid-sandbox'], headless: false, defaultViewport: null});
  const page = await browser.newPage();
  await page.goto('https://en.wikipedia.org/wiki/Albert_Einstein');
  await page.screenshot({path: 'screenshot.png', captureBeyondViewport: false});
  
  await wait(2000)
  await browser.close();
})();

关于javascript - Puppeteer:page.screenshot 调整视口(viewport)大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68059664/

相关文章:

由于 CSS,Puppeteer 返回大写的 innerText 值

firebase - 在 Firebase Functions (Google Cloud) 上创建 Puppeteer PDF 超时

javascript - 奇怪的日期解析

javascript - 使用相同的类,使用 javascript 一次悬停 3 个项目

Javascript 模块模式导入

javascript - NodeJS : invalid array length Allocation failed - JavaScript heap out of memory

javascript -/tmp/chromium : error while loading shared libraries: libnss3. 所以:无法打开共享对象文件:没有这样的文件或目录 Vercel

javascript - 如何从行尾(SVG)绘制动画?

javascript - 使用 for 循环获取数组中的值

javascript - 找不到指定 id 未定义的上下文