node puppeteer截图教程

Puppeteer 简介

puppeteer is a Node library which provides a high-level API to control Chrome or Chromium over the DevTools Protocol. Puppeteer runs headless by default, but can be configured to run full (non-headless) Chrome or Chromium.

Puppeteer 是一个通过 DevTools 协议提供高级别 API 来控制 Chrome 或 Chromium 的 node 库。Puppeteer 默认以 headless 模式运行，但是可以通过修改配置文件运行“有头”模式。

为什么要用 Puppeteer 来截图？

常见的使用场景：

1、自动化测试

2、借助 Puppeteer 截图实现服务端绘图，简单高效

Puppeteer 截屏实例

1、安装 puppeteer

npm i puppeteer
# or

yarn add puppeteer

2、创建一个 js 文件

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.tides.cn');
  await page.screenshot({ path: 'tides.png' });

  await browser.close();
})();

使用 node 运行上述 js 文件即可得到一张文件名为 tides.png 的截图。

实际项目中，可以指定输出图片格式为 jpg，截图、图片输出以及图片传输的速度都会得到较大提升。

小结

Puppeteer 在自动化测试和服务端绘图领域有着广泛的应用，简单高效；

输出图片格式指定为 jpg 通常会更快速

本文地址：https://www.tides.cn/p_node-puppeteer-screenshot