一、Puppeteer 简介
1、Puppeteer
- 单词本义
Puppet 木偶,傀儡
Puppeteer操纵木偶的人 - 软件工具
Puppeteer是一个 node 库,他提供了一组用来操纵 Chrome 的API,允许通过JS代码操纵 Chrome 浏览器,完成数据爬取、Web程序自动测试等任务
官方网址:https://github.com/GoogleChrome/puppeteer
2、Puppeteer 核心功能
(1)利用网页生成PDF、图片
(2)爬取SPA应用,并生成预渲染内容(即“SSR” 服务端渲染)
(3)可以从网站抓取内容
(4)自动化表单提交、UI测试、键盘输入等
(5)帮你创建一个最新的自动化测试环境(chrome),可以直接在此运行测试用例
(6)捕获站点的时间线,以便追踪你的网站,帮助分析网站性能问题
二、Chrome Headless环境要求
- Puppeteer 要求 Node 版本不低于 v6.4.0, 但是例子中使用的 async/await 只在 Node v7.6.0 或更高的版本支持
- 需要最近版本的 Chromium 浏览器:
- Chromium浏览器项目是Google发布Chrome之后的开源项目
- Chrome浏览器基于Chromium(谷歌浏览器)
- 新特性会在Chromium中先行先试。
- Puppeteer与其绑定的版本的Chromium配合最好,版本不对应不保证正确运行
- node_modules\puppeteer下面的 package.json 中有绑定的版本
- 打开 chrome://version 可查询 Chromium 浏览器版本
- 如果使用 Chrome 而不是 Chromium 浏览器,Puppeteer 要求 Mac 和 Linux 浏览器版本不低于 59. Windows不低于 60
- 建议是 Chrome Canary 或 Dev Channel 构建版本
三、安装
1、新建一个文件夹,打开终端窗口,进入该文件夹,设置环境变量
- 避免缺省的下载 chromium方式。
set PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1
- 可阻止下载 Chromium (因为封网,直接下载会失败)
2.安装 puppeteer 模块,注意路径在自己的工作目录
npm i puppeteer
3.下载chromium for Mac。
4. 创建 index.js,并在启动chromium的lauch函数中指定 chromium 所在路径。
注:Mac下的路径为:
/Users/xinna/Documents/gitrepository/chromeheadless/chromium/Chromium.app/Contents/MacOS/Chromium
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({executablePath: './chromium/Chromium.app/Contents/MacOS/Chromium',headless: false});
const page = await browser.newPage();
await page.goto('https://y.qq.com');
await page.screenshot({path: 'yqq.png'});
browser.close();
})();
5. 运行 node index.js
运行成功后,会保存一个网页截图 yqq.png
结束了哦^_^!