在前端开发中，很多时候需要进行自动化测试或者爬虫等操作，这时候就会使用到 Puppeteer，它是一个基于 Chrome 的高级 Node.js 库，它提供了操作 Chrome 浏览器的API，可以用于自动化网页交互和爬虫等领域。而在使用 Puppeteer 的时候，我们可以通过 npm 包 puppeteering 来快速上手。
安装
可以通过 npm 来安装 puppetering，安装命令如下：
npm install puppeteering
使用
在安装之后，需要在代码中引入 puppeteering 模块。
const puppeteer = require('puppeteer');打开浏览器
打开浏览器一般需要使用 puppeteer.launch() 方法，并在方法中传入一些配置，如下所示：
const browser = await puppeteer.launch({
headless: true // 是否启用头less模式
});上面的代码中，headless 这个配置项设置为 true 表示启用无头模式，也就是在后台运行 Chrome，而不会真正地打开浏览器窗口。如果设置为 false 则会真正地打开浏览器。
打开一个页面
打开一个页面需要使用 browser.newPage() 方法，这个方法会返回一个 Page 对象，用于后续的页面交互。示例代码如下：
const page = await browser.newPage();
await page.goto('https://github.com/');上面的代码中，goto() 方法用于导航到指定的 URL。
进行页面操作
在打开网页之后，我们通常需要与页面进行一些交互操作，如下面的代码所示：
await page.type('#login_field', 'my_name'); // 输入用户名
await page.type('#password', 'my_password'); // 输入密码
await page.click('#login > form > div.auth-form-body.mt-3 > input.btn.btn-primary.btn-block'); // 点击登录按钮上面的代码中，我们使用了 page.type() 方法来输入数据，使用 page.click() 方法来点击按钮，这些操作都是非常常见的。
获取页面内容
在进行页面操作之后，我们通常也需要获取页面的某些内容，如下面的代码所示：
const title = await page.title(); // 获取页面标题 const html = await page.content(); // 获取页面 HTML 内容
上面的代码中，我们使用了 page.title() 方法来获取页面的标题，使用 page.content() 方法来获取页面的 HTML 内容，这些方法都是非常常用的。
关闭浏览器
最后，我们还需要关闭浏览器，以释放资源。
await browser.close();
总结
在本篇文章中，我们介绍了 npm 包 puppeteering 的使用方法，包括打开浏览器、打开一个页面、进行页面操作、获取页面内容以及关闭浏览器等内容。希望读者能够通过本篇文章快速上手 Puppeteer，并在实际的开发过程中使用 Puppeteer 更加高效地进行网页交互和爬虫等操作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055fe481e8991b448dd870