Question

我正在使用puppeteer获取特定宽度的页面screnshot：

await page.setViewport({width: 320, height: 0})
await page.goto(url)
await page.screenshot({path: `screenshot.png`, fullPage: true});

屏幕截图的宽度正好是320像素。但是可以保存缩放的屏幕截图（例如，大2倍）吗？就像在开发人员工具中一样 - 我可以在那里设置缩放150％。

Answer 1

您可以在page.setViewport

上使用deviceScaleFactor

await page.setViewport({width: 320, height: 0, deviceScaleFactor:2});

Answer 2

更新2020

调度mousewheel事件以进行缩放：

await page.mouse.wheel({ deltaX, deltaY })

新的Mouse#wheel API已合并到v5.3.1中。它的行为类似于其他鼠标命令，例如up或down，因此需要mouse.move(x, y)才能正确定位元素。

await page.goto('https://mdn.mozillademos.org/en-US/docs/Web/API/Element/wheel_event$samples/Scaling_an_element_via_the_wheel?revision=1587366');
const elem = await page.$('div');
const boundingBox = await elem.boundingBox();
await page.mouse.move(
  boundingBox.x + boundingBox.width / 2,
  boundingBox.y + boundingBox.height / 2
);
await page.mouse.wheel({ deltaY: -100 })

文档：https://pptr.dev/#?product=Puppeteer&version=v5.3.1&show=api-mousewheeloptions

Pupeteer：用缩放（缩放）拍摄网页截图

2 个答案:

更新2020