web前端自動化測試及爬蟲利器puppeteer介紹
Intro
Chrome59(linux越走、macos)账胧、 Chrome60(windows)之后,Chrome自帶headless(無界面)模式很方便做自動化測試或者爬蟲错英。但是如何和headless模式的Chrome交互則是一個問題秉宿。通過啟動Chrome時的命令行參數(shù)僅能實現(xiàn)簡易的啟動時初始化操作。Selenium氯迂、Webdriver等是一種解決方案践叠,但是往往依賴眾多,不夠扁平囚戚。
Puppeteer是谷歌官方出品的一個通過DevTools協(xié)議控制headless Chrome的Node庫酵熙。可以通過Puppeteer的提供的api直接控制Chrome模擬大部分用戶操作來進行UI Test或者作為爬蟲訪問頁面來收集數(shù)據(jù)驰坊。
Github 倉庫:https://github.com/GoogleChrome/puppeteer
安裝
Puppeteer本身依賴6.4以上的Node匾二,但是為了異步超級好用的async/await,推薦使用7.6版本以上的Node拳芙。另外headless Chrome本身對服務(wù)器依賴的庫的版本要求比較高察藐,centos服務(wù)器依賴偏穩(wěn)定,v6很難使用headless Chrome舟扎,提升依賴版本可能出現(xiàn)各種服務(wù)器問題(包括且不限于無法使用ssh)分飞,最好使用高版本服務(wù)器。
Puppeteer因為是一個npm的包睹限,所以安裝很簡單:
npm i puppeteer
或者
yarn add puppeteer
Puppeteer 安裝時自帶一個最新版本的Chromium譬猫,可以通過設(shè)置環(huán)境變量或者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.
大多數(shù)在瀏覽器里手動可以做的事都可以用 puppeteer 來做,比如說:
- 生成一些網(wǎng)頁的截圖和 pdf
- 爬取一個 SPA(單頁 WEB 應(yīng)用)并且生成預(yù)渲染內(nèi)容(比如說過SSR,服務(wù)器端渲染)
- 自動化的表單提交叨恨,UI 測試柳刮,文本輸入等
- 創(chuàng)建一個現(xiàn)代化的自動化測試環(huán)境,在最新版的Chrome 里使用最新的 JavaScript 和瀏覽器新特性來跑你的測試痒钝。
- 捕獲你的網(wǎng)站的 timeline trace 來幫助分析診斷性能問題
- 測試谷歌擴展插件
你可以在 https://try-puppeteer.appspot.com/ 嘗試一些 puppeteer 的功能秉颗。
Api 文檔:https://github.com/GoogleChrome/puppeteer/blob/v1.10.0/docs/api.md
示例:https://github.com/GoogleChrome/puppeteer/tree/master/examples
Reference
Contact
Contact me: weihanli@outlook.com