Puppeteer是谷歌官方出品的一个通过DevTools协议控制headless Chrome的Node库。可以通过Puppeteer的提供的api直接控制Chrome模拟大部分用户操作来进行UI Test或者作为爬虫访问页面来收集数据。
demo操作流程:
1.新建一个目录: mkdir pupdemo
2.进入到这个目录: cd pupdemo
3.初始化package.json, 运行命令:npm init (一路回车就好了)
4.安装Node依赖模块,运行命令:npm install --save-dev
5.新建index.js,源代码如下:
// 引入模块 const puppeteer = require('puppeteer'); // 异步执行代码 (async () => { // 运行一个带UI的chrome浏览器 const browser = await puppeteer.launch({headless: false}); // 新建一个标签页 const page = await browser.newPage(); // 打开网址 await page.goto('https://baidu.com'); // 在文本框('#kw': ID为kw的元素)中输入puppeteer, 然后等100毫秒 await page.type('#kw', 'puppeteer', {delay: 100}); // 点击按钮('#su': ID为su的元素) page.click('#su') // 等1s await page.waitFor(1000); // 执行一段脚本,用于返回页面的信息: width 宽, height 高, devicePixelRatio 这个可以百度 const dimensions = await page.evaluate(() => { return { width: document.documentElement.clientWidth, height: document.documentElement.clientHeight, deviceScaleFactor: window.devicePixelRatio }; }); // 在命令行控制台输出信息 console.log('Dimensions:', dimensions); // 再执行一段脚本,用于返回".result a" 选择器查到的元素文本中包含'Puppeteer的入门和实践'的内容(其中就是找出它的链接地址) const targetLink = await page.evaluate(() => { return [...document.querySelectorAll('.result a')].filter(item => { return item.innerText && item.innerText.includes('Puppeteer的入门和实践') }).toString() }); // 跳转这个链接地址 await page.goto(targetLink); // 等1s await page.waitFor(1000); // browser.close(); 这句代码会关闭窗口,为了体现效果先注释 })()
6.运行命令:node --harmony index.js (然后就可以看到会自动打一个chrome浏览器,并打开指定网页,输入文本及点击按钮一系统操作)