web前端自动化测试及爬虫利器puppeteer介绍

作者: 图恩分类: 编程开发阅读: 755发布时间： 2021-08-10 22:30:23

web前端自动化测试及爬虫利器puppeteer介绍

Intro

Chrome59(linux、macos)、 Chrome60(windows)之后，Chrome自带headless(无界面)模式很方便做自动化测试或者爬虫。但是如何和headless模式的Chrome交互则是一个问题。通过启动Chrome时的命令行参数仅能实现简易的启动时初始化操作。Selenium、Webdriver等是一种解决方案，但是往往依赖众多，不够扁平。

puppeteer

Puppeteer是谷歌官方出品的一个通过DevTools协议控制headless Chrome的Node库。可以通过Puppeteer的提供的api直接控制Chrome模拟大部分用户操作来进行UI Test或者作为爬虫访问页面来收集数据。

Github 仓库：https://github.com/GoogleChrome/puppeteer

安装

Puppeteer本身依赖6.4以上的Node，但是为了异步超级好用的async/await，推荐使用7.6版本以上的Node。另外headless Chrome本身对服务器依赖的库的版本要求比较高，centos服务器依赖偏稳定，v6很难使用headless Chrome，提升依赖版本可能出现各种服务器问题（包括且不限于无法使用ssh），最好使用高版本服务器。

Puppeteer因为是一个npm的包，所以安装很简单：

npm i puppeteer

或者

yarn add puppeteer

Puppeteer 安装时自带一个最新版本的Chromium，可以通过设置环境变量或者npm config中的PUPPETEER_SKIP_CHROMIUM_DOWNLOAD 跳过下载。如果不下载的话，启动时可以通过puppeteer.launch([options])配置项中的 executablePath 指定Chromium的位置。

Use

用 puppeteer 来做什么

Most things that you can do manually in the browser can be done using Puppeteer! Here are a few examples to get you started:

Generate screenshots and PDFs of pages.

Crawl a SPA (Single-Page Application) and generate pre-rendered content (i.e. "SSR" (Server-Side Rendering)).

Automate form submission, UI testing, keyboard input, etc.

Create an up-to-date, automated testing environment. Run your tests directly in the latest version of Chrome using the latest JavaScript and browser features.

Capture a timeline trace of your site to help diagnose performance issues.

Test Chrome Extensions.

大多数在浏览器里手动可以做的事都可以用 puppeteer 来做，比如说：