Puppeteer 是 Google Chrome 团队官方的Chrome 自动化工具。它本身是基于Chrome Dev Protocol协议实现的，但它提供了更高层次API封装，使用起来更加方便快捷。加上google这个大咖加官方的背景，更使得其地位更是提升了不少。

我之前在文章使用Chrome快速实现数据的抓取（五）—— puppeteer中简单的介绍过一下它，之前准备写一系列文章来详细介绍下它的，但由于种种原因一直耽搁了，这篇文章其实在电脑里已经存了不少时间了，今天抽空整理了下，将其发表出来。

安装NodeJS

Puppeteer是一个NodeJS的开发包，因此需要安装Node环境的，它本身依赖的最低版本是Node v6.4。但由于里面的大量异步调用，因此最好使用支持async/await的 v7.6或更高版本。

关于NodeJS的安装这里就不介绍了，我这里使用的是windows环境，基本上是一路next就好了。

安装puppeteer

建立Node工程后，首先需要引入puppeteer包，使用npm命令即可：

npm install puppeteer

但这儿有一个需要注意的地方是，这个包会下载一个Chromium，由于网络原因，这个过程是非常慢的，并且也会造成重复下载，每个工程都要下载一个，费时费力。

这个问题的解决方法是，安装时添加--ignore-scripts命令跳过Chromium的下载，

npm install puppeteer --ignore-scripts

然后指定我们安装的Chrome或Chromium启动。具体方法后面再介绍

示例：

首先还是来一个简单的示例。

const puppeteer = require('puppeteer');

async function run () {    const browser = await puppeteer.launch({        headless: false,        executablePath: "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"    });    const page = await browser.newPage();    await page.goto('https://tianfang.cnblogs.com');    await page.screenshot({ path: 'screen.png' });    await browser.close();};

run(); 

代码很简单，运行后就会启动一个chrome，然后访问我的博客，并且截图保存。

启动参数：

首先我们来看前面代码的启动参数：

const browser = await puppeteer.launch({    headless: false,    executablePath: "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"}); 

这里我设置了两个参数：

1. 是否开启界面： headless

如果把它设为true的话，则不显示界面，理论上也有更好的性能。这里将其设置为false，主要是为了调试方便。

1. Chrome路径： executablePath

因为我安装的时候跳过了Chromium的下载，因此这里显式指定了chrome的路径。

在日常使用中，往往还有些其它参数要设置的。

1. 用户数据路径： userDataDir

用户数据路径，这样chrome可以使用你的一些设置和缓存

注意： 如果用户数据路径中包含中文，记得将js保存为utf8格式，以免不认识

1. 其它参数： args

默认情况下，chrome是不加载扩展的，可以在args中启用扩展

args: [    `--disable-extensions-except=${ext}`,    `--load-extension=${ext}`] 

设置浏览器大小：

默认浏览器大小是1024*768，可以通过page.setViewport设置其大小。

page.setViewport({ width: 1024, height: 768 }); 

有了上面基础后，前面代码就改为如下所示了：

const puppeteer = require('puppeteer');

const chrome_exe = String.raw`${process.env["ProgramFiles(x86)"]}\Google\Chrome\Application\chrome.exe`;const user_data_path = String.raw`${process.env.LocalAppData}\Google\Chrome\User Data\Default`; async function run() {    const browser = await puppeteer.launch({        headless: false,        userDataDir: user_data_path,        executablePath: chrome_exe    });    const page = await browser.newPage();    page.setViewport({ width: 1600, height: 800 });    await page.goto('https://tianfang.cnblogs.com');    await page.screenshot({ path: 'screen.png' });    await browser.close();};

run(); 

小结：

由于篇幅所限，本文就简单的介绍到这里。具体进一步使用方法待下一篇文章中继续介绍。感兴趣的朋友可以看看这两篇文章。（实际是同一篇文章，中文的那个是译文）

1. https://github.com/emadehsan/thal。
2. http://csbun.github.io/blog/2017/09/puppeteer/

另外，虽然有Puppeteer珠玉在前，也还是有Chromeless这样1w多start的受欢迎的第三方社区版本出现，感兴趣的朋友可以了解一下。