檢測Chrome headless的技巧

原文鏈接：
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");
}