检测Chrome headless的技巧

原文链接： https://antoinevastel.com/bot%20detection/2018/01/17/detect-chrome-headless-v2.html

原文链接：
https://antoinevastel.com/bot%20detection/2018/01/17/detect-chrome-headless-v2.html

更新：我创建了一个库，可以通过浏览器指纹来检测脚本和爬虫。这个库仍然在开发过程中，不过你可以开始尝试使用了。代码已经在Github上了，目前，我在测试一个新的检测方法，欢迎来进行挑战，并给出反馈。

---

之前我写了一个博文，关于检测Chrome headless的一些技巧。在那之后，我收到了一些反馈说有些技巧已经失效了。在进行了一些测试之后，确认最后三个技巧已经失效了：WebGL特征、浏览器特征、以及当Chrome加载图片失败时图片大小的特征。

因此，在这个博文中，我会介绍一下检测Chrome headless仍然有效的一些技巧（新发现的和之前仍然有效的）。

User agent (旧)

首先我们介绍一个在之前博文提出的简单方法：User Agent。这是普遍用来区分用户操作系统和浏览器的一个属性。在Linux系统上，使用版本为63的Chrome，其对应的User Agent为：Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/63.0.3071.115 Safari/537.36

因此，我们可以检查Chrome headless的User Agent特征：

if (/HeadlessChrome/.test(window.navigator.userAgent)) {
    console.log("Chrome headless detected");
}

User Agent也可以通过HTTP头来获取。当让，不管如何获取，想要篡改User Agent都是一件很容易的事情。

Webdriver（新）

为了能够自动化的操控Chrome headless，一个新的属性webdriver被引入了进来（可以查看Chromium代码），用来操控对象。因此，可以通过检测这个属性的存在，来判断是否是Chrome headless。

if(navigator.webdriver) {
    console.log("Chrome headless detected");
}

Chrome (新)

window.chrome是一个给Chrome扩展插件开发人员使用的新的特性。这个特性在Chrome vanilla模式下存在，但是在headless模式下不存在

// isChrome is true if the browser is Chrome, Chromium or Opera
if(isChrome && !window.chrome) {
    console.log("Chrome headless detected");
}

权限 (新)

目前，在headless模式下，还无法对权限进行操作。因此，这会导致Notification.permission和navigator.permissions.query不一致的情况。

navigator.permissions.query({name:'notifications'}).then(function(permissionStatus) {
    if(Notification.permission === 'denied' && permissionStatus.state === 'prompt') {
        console.log('This is Chrome headless')	
    } else {
        console.log('This is not Chrome headless')
    }
});

最后，在介绍一下上一个博文已经提到的两个方法。

插件 (旧)

navigator.plugins会返回浏览器中存在的插件列表。通常情况下，会返回Chrome中的默认插件，比如：Chrome PDF viewer或者Google Native Client。相对的，在headless模式中，这个列表不包含任何插件。

if(navigator.plugins.length === 0) {
    console.log("It may be Chrome headless");
}

语言 (旧)

在Chrome中，可以通过两个Javascript的属性来获取用户使用的语言：navigator.language 和 navigator.languages。第一个是浏览器UI的语言，第二个是用户偏好语言的列表。然而，在headless模式中，navigator.languages会返回一个空的字符串。

if(navigator.languages === "") {
    console.log("Chrome headless detected");
}