什么是无头浏览器
无头浏览器即headless browser,是一种没有界面的浏览器。它有浏览器该有的一切功能,除了界面。可以通过命令进行浏览器内的各种操作。
我们日常使用浏览器的步骤为:启动浏览器、打开一个网页、进行交互。在无头浏览器中,我们可以通过程序或脚本来执行以上过程,从而模拟出真实的浏览器使用场景。
无头浏览器应用场景
有了无头浏览器,我们就能做包括但不限于以下事情:
- 对网页进行截图保存为图片或 pdf
- 做表单的自动提交、UI的自动化测试、模拟键盘输入等
- 用浏览器自带的一些调试工具和性能分析工具帮助我们分析问题
- 在最新的无头浏览器环境里做测试、使用最新浏览器特性
- 写爬虫,抓取站点数据
- Web自动化测试
- 抓取单页应用(SPA)执行并渲染(解决传统 HTTP 爬虫抓取单页应用难以处理异步请求的问题)
- 执行DDOS攻击
- 增加广告展示次数
- 认证信息填充(自动登录等)
无头浏览器有哪些
无头浏览器很多,包括但不限于:
- Google Chrome: 从版本59开始支持无头浏览模式;
- Firefox: 从版本55(Linux)/ 版本56(Windows、MacOS)开始支持无头模式;
- PhantomJS, 基于 Webkit
- SlimerJS, 基于 Gecko
- HtmlUnit, 基于 Rhnio
- TrifleJS, 基于 Trident
- Splash, 基于 Webkit
无头浏览器的应用实例
这里以puppeteer
举例说明。 Puppeteer是一个Node库,提供了高级API通过DevTool来控制Chrome或Chromium。默认headless也就是无UI的chrome,也可以配置为有UI。
安装puppeteer
npm install --save puppeteer
模拟登陆
const puppeteer = require('puppeteer');
const LOGIGPAGE = 'http://example.cn/';
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto(LOGIGPAGE);
await page.type('#username', "your username");
await page.type('#password', 'your password');
await page.click('#btn-login');
//页面登录成功后,需要保证redirect 跳转到请求的页面
await page.waitForNavigation();
await browser.close();
})()
如何检测无头浏览器
UserAgent检测
无头浏览器的UA中通常会带有headless 关键字
plugins检测
无头浏览器的navigator.plugins.length === 0
language检测
无头浏览器的navigator.languages === null
【参考资料】
Puppeteer 入门教程