浅析Node.js中怎么使用Puppeteer库

第浅析Node.js中怎么使用Puppeteer库Puppeteer是谷歌官方出品的一个通过DevTools协议控制headlessChrome的Node库。可以通过Puppeteer的提供的api直接控制Chrome模拟大部分用户操作来进行UITest或者作为爬虫访问页面来收集数据。

中文文档

https://zhaoqize.github.io/puppeteer-api-zh_CN/#/

作用：

能做什么

生成页面PDF。

抓取SPA（单页应用）并生成预渲染内容。

自动提交表单，进行UI测试，键盘输入等。

创建一个时时更新的自动化测试环境。使用最新的JavaScript和浏览器功能直接在最新版本的Chrome中执行测试。

捕获网站的timelinetrace，用来帮助分析性能问题。

测试浏览器扩展。

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

npmipuppeteer

或者

yarnaddpuppeteer

如何使用：

//引入Puppeteer模块

letpuppeteer=require(puppeteer)

//puppeteer.launch实例化开启浏览器

asyncfunctiontest(){

//可以传入一个options对象({headless:false})，可以配置为无界面浏览器，也可以配置有界面浏览器

//无界面浏览器性能更高更快，有界面一般用于调试开发

letoptions={

//设置视窗的宽高

defaultViewport:{

width:1400,

height:800

//设置为有界面，如果为true，即为无界面

headless:false,

//设置放慢每个步骤的毫秒数

slowMo:250

letbrowser=awAItpuppeteer.launch(options);

//打来新页面

letpage=awaitbrowser.newPage();

//配置需要访问网址

awaitpage.goto()

//截图

awaitpage.screenshot({path:test.png

//打印pdf

awaitpage.pdf({path:example.pdf,format:A4

//结束关闭

awaitbrowser.close();

}test()

//获取页面内容

//$$eval函数，使回调函数可以运行在浏览器中，并且可以通过浏览器的方式进行输出

awaitpage.$$eval(#head#s-top-lefta,(res)={

//console.log(res);

res.forEach((item,index)={

console.log($(item).attr(href

//监听console.log事件

page.on(console,(...args)={

console.log(args);

//获取页面对象,添加点击事件

ElementHandle=awaitpage.$$(#head#s-top-lefta)

ElementHandle[0].click();

//通过表单输入进行搜索

inputBox=awaitpage.$(#form.s_ipt_wr#kw)

awaitinputBox.focus()//光标定位在输入框

awaitpage.keyboard.type(Node.js)//向输入框输入内容

search=awaitpage.$(.s_btn_wrinput[type=submit])

search.click()//点击搜索按钮

爬虫实践

很多网页通过user-agent来判断设备，可以通过page.emulate(options)来进行模拟。options有两个配置项，一个为userAgent，另一个为viewport可以设置宽度(width)、高度(height)、屏幕缩放(deviceScaleFactor)、是否是移动端(isMobile)、有无touch事件(hasTouch)。

constpuppeteer=require(puppeteer

constdevices=require(puppeteer/DeviceDescriptors

constiPhone=devices[iPhone6

puppeteer.launch().then(asyncbrowser={

constpage=awaitbrowser.newPage();

awaitpage.emulate(iPhone);

awaitpage.goto(

//otheractions...

awaitbrowser.close();

});

上述代码则模拟了iPhone6访问某网站，其中devices是puppeteer内置的一些常见设备的模拟参数。

很多网页需要登录，有两种解决方案：

让puppeteer去输入账号密码常用方法：点击可以使用page.click(selector[,options])方法，也可以选择聚焦page.focus(selector)。输入可以使用page.type(selector,text[,options])输入指定的字符串，还可以在options中设置delay缓慢输入更像真人一些。也可以使用keyboard.down(key[,options])来一个字符一个字符的输入。

如果是通过cookie判断登录状态的可以通过page.setCookie(...cookies)，想要维持cookie