puppeteer使用指南-入门
原创
上篇文章讲解了如何安装puppeteer，这篇文章我们通过几个小案例来了解一下puppeteer的常用api的使用方法。
案例1：截图百度首页，代码如下：
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({
headless: true
})
const page = await browser.newPage()
await page.goto('http://www.baidu.com')
await page.screenshot({
path: 'baidu.png'
})
})()阅读源码，梳理一下使用步骤：
1、引入puppeteer这个库
2、通过puppeteer.launch启动浏览器实例browser，参数headless为true，默认为true，为true时不打开浏览器，为false时会打开一个浏览器。
3、浏览器browser实例调用newPage方法，相当于浏览器打开了一个tab页page。
4、调用page的goto方法，导航到目的地址。
5、调用page的screenshot方法截图，参数为截图的保存路径。
组要注意的是，所有过程都是在async函数中完成的，每一步有需要await，比较重要的是前三步骤，后面会经常用到。
实现了截图，下面看一下如何使用百度进行搜索。
案例2，百度搜索，代码如下：
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({
headless:false
});
const page = await browser.newPage();
await page.emulate(puppeteer.devices['iPhone 6']);
await page.goto('https://www.baidu.cn');
await page.focus('#index-kw')
await page.type('#index-kw','Alibaba', { delay: 1000 });
await page.click('#index-bn')
await page.waitForTimeout(1000);
await page.screenshot({ path: 'full.png', fullPage: true });
await browser.close();
})();这段代码较前面的增加了些许新功能：
1、page.emulate()函数按照给定设备对页面的尺寸进行了设定。
2、puppeteer.devices中保存着很多设备的尺寸，这里使用iPhone6,当然也可以自定义。
3、page.focus函数聚焦页面中的某个表单元素，函数的参数为选择器，这里也可以是好用click进行聚焦，这里是输入框。
4、page.type函数时向某个表单元素输入值，delay是模拟人输入的时间。具体用法为page.type(selector,value,options)
5、page.click('#index-bn')点击搜索按钮
6、page.waitForTimeout(1000)暂停1秒，方便截图
接着看第三个案例：
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({ headless: false });
const page = await browser.newPage();
await page.goto('https://baidu.com');
await page.type('#kw', 'puppeteer', { delay: 100 });
page.click('#su')
await page.waitForTimeout(1000);
const targetLink = await page.evaluate(() => {
console.log("[...document.querySelectorAll('.result a')]", [...document.querySelectorAll('.result a')])
return [...document.querySelectorAll('.result a')].filter(item => {
return item.innerText && item.innerText.includes('puppeteer')
}).join("======================")
});
console.log("targetLink:", targetLink);
await page.goto(targetLink.split("======================")[0]);
await page.waitForTimeout(1000);
browser.close();
})()第三个案例我们增加了 page.evaluate函数，这个函数的参数是一个函数，这个函数相当于在这个page页面内部执行的js脚本。并且有返回值，其返回值只能是字符串，这样外面的js才能和page的js进行通讯，外部拿到字符串在进行操作， page.evaluate通常是用作爬虫来使用。
三个案例讲完了，我们来总结一下
1、首先了解了如何送puppeteer来进行进图
2、如何使用puppeteer来模拟人的行为
3、爬虫入门，通过 page.evaluate函数在page页面中执行js来选择dom元素实现爬虫功能。
以上是puppeteer的简单使用希望对你有所帮助
参考：https://www.cnblogs.com/yfacesclub/p/9245068.html
https://www.jianshu.com/p/2f04f9d665ce
https://blog.csdn.net/weixin_38190633/article/details/108663172
https://www.cnblogs.com/yfacesclub/p/9245068.html
https://www.jianshu.com/p/56babda610f9
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。