Headless Chromium 实践

[billfeller]

1. Headless Chromium 是什么

Headless Chromium 是一种在无头环境下运行Chrome浏览器的方式，通过它建Chromium、Blink渲染引擎提供的现代Web平台功能带入命令行、服务端渲染环境。随着Google在Chrome 59版本放出了headless模式，Ariya Hidayat决定放弃对Phantom.js的维护，这也标示着Phantom.js 统治fully functional headless browser的时代将被chrome-headless代替。

Headless Chrome 较 Phantom.js 优势在于

1. Google Chrome团队维护项目，那么就意味不会出现phantomjs近2k问题没人维护的尴尬局面。
2. 支持更快更好的性能，更少的内存占用；
3. 支持ES6+等现代前端特性；
4. 支持 Chrome Remote Debug 远程调试特性；

2. 应用场景

Headless Chromium 可以替代 Phantom.js 应用场景，使用于服务端渲染、自动化UI测试等领域。理论上，通过浏览器可以实现的操作都应该可以通过 Headless Chromium 来实现。

3. 调用方法

Google 提供了多种不同方式实现Headless Chromium调用

1. 命令行模式

Chrome 59+ 内置通过 --headless 启动调用：

chrome \
  --headless \                   # Runs Chrome in headless mode.
  --disable-gpu \                # Temporarily needed if running on Windows.
  --remote-debugging-port=9222 \
  https://www.chromestatus.com   # URL to open. Defaults to about:blank.

命令行模式使用一些无需编程控制的应用场景，可以通过命令行快速实现一些通用任务。

目前，命令行目前支持包括： 1. --dump-dom 打印DOM节点 2. --print-to-pdf 创建PDF 3. --screenshot 生成截图 4. --repl 支持REPL模式

完整命令行参数见文档 List of Chromium Command Line Switches Command line features

2. 编程模式

官方还提供了 Puppeteer NPM，实现编程控制 Headless Chrome 目的。Puppeteer 可以实现如上命令行模式的所有功能，同时通过提供 api 实现对执行过程的控制，使用于自动化测试等领域。开发过程只需要 npm i --save puppeteer 即可使用。

如下提供了官方的两个简单示例

打印用户代理：

const puppeteer = require('puppeteer');

(async() => {
  const browser = await puppeteer.launch();
  console.log(await browser.version());
  await browser.close();
})();

创建pdf：

const puppeteer = require('puppeteer');

(async() => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://www.baidu.com', {waitUntil: 'networkidle2'});
await page.pdf({path: './baidu.pdf', format: 'A4'});

await browser.close();
})();

完整API详情请见： Puppeteer API v1.2.0-post NOT RELEASED

为了方便开发调试，官方还提供了 chrome-remote-interface。

总结

目前Headless Chrome仍然存在一些问题，还需要不断完善，简单实测中也发现了诸如生成截图时进程异常等问题。但是，已知问题并不能妨碍我们去拥抱新工具，提升开发效率。

更多阅读

headless Chromium puppeteer phantomJs之殇，chrome-headless之生 List of Chromium Command Line Switches