前一段時(shí)間在作者群里大家討論，萌生了寫(xiě)個(gè)油猴腳本的想法，主要作用是給頁(yè)面上增加一些好玩的功能。在寫(xiě)腳本的過(guò)程中，重新整理了一些關(guān)于油猴腳本的信息，也就有了本文。
油猴腳本，正式的叫法是用戶(hù)腳本（user script）。之所以叫做「油猴」，是因?yàn)榈谝粋€(gè)制作這個(gè)瀏覽器擴(kuò)展的作者 Aaron Boodman 起名叫做 Greasymonkey，中文直譯就是「油膩的猴子」；后面其他腳本開(kāi)發(fā)的時(shí)候，基本都在沿用 Greasymonkey 的一些基本規(guī)范，這些腳本也就統(tǒng)稱(chēng)為「油猴腳本」了。
本文后續(xù)還是會(huì)采用本名「用戶(hù)腳本」。
你可以將用戶(hù)腳本理解為一種可以根據(jù)我們的實(shí)際需求，為網(wǎng)頁(yè)「加料」的手段。如果你之前從來(lái)沒(méi)有使用過(guò)用戶(hù)腳本又想體驗(yàn)一下的話(huà)，可以按照以下步驟操作來(lái)快速感受一下它的魅力：
安裝好之后，訪(fǎng)問(wèn)我的 作者文章頁(yè)面 （或者你喜歡的其他作者），在右側(cè)的「成就與徽章」這一部分，你就可以看到多出來(lái)了一個(gè)新的部分。如果這個(gè)作者太長(zhǎng)時(shí)間沒(méi)有更新，就會(huì)出現(xiàn)個(gè)紅色的字體激勵(lì)作者去寫(xiě)稿哦：
雖然這個(gè)腳本非常簡(jiǎn)單，但是看到這里，你已經(jīng)了解了用戶(hù)腳本最核心的功能了。
最早的時(shí)候，F(xiàn)irefox 火狐瀏覽器向開(kāi)發(fā)者開(kāi)放了擴(kuò)展的能力，所有的開(kāi)發(fā)者可以在火狐瀏覽器開(kāi)放的能力內(nèi)開(kāi)發(fā)一些新的能力。 2004 年底，Aaron Boodman 在看到另一個(gè)用于精簡(jiǎn)網(wǎng)頁(yè)的擴(kuò)展的時(shí)候，想到了這個(gè)絕妙的點(diǎn)子，隨機(jī)在 2005 年初發(fā)布了最初的 0.25版本 Greasymonkey。
很快，大家就想到了通過(guò) Greasymonkey 寫(xiě)一些用于屏蔽廣告的腳本（這個(gè)習(xí)俗到現(xiàn)在都還有），但也被一些廣告主吐槽。不過(guò)后面等到 ADblock 上線(xiàn)之后大家就轉(zhuǎn)而去噴這一類(lèi)擴(kuò)展了。
到了 2010 年，隨著 Chrome 瀏覽器高歌猛進(jìn)，另一位作者 Jan Biniok 開(kāi)發(fā)了 Chrome 版本的用戶(hù)腳本管理器擴(kuò)展，起名叫做 Tampermonkey，直譯應(yīng)該叫做「篡改的猴子」。
我個(gè)人覺(jué)得這個(gè)名字比 Greasymonkey 更貼切一些，符合用戶(hù)腳本的實(shí)際作用。
到目前為止，Tampermonkey 已經(jīng)有超過(guò)千萬(wàn)的用戶(hù)下載使用了，評(píng)分也非常高，是目前平臺(tái)支持最完整的用戶(hù)腳本擴(kuò)展。Tampermonkey 在權(quán)限控制、腳本編輯和調(diào)試、全局黑白名單這些方面都做得相當(dāng)不錯(cuò)，易用性相比 Greasymonkey 提升了不少。
而 2013 年 Violentmonkey「暴力猴」的上線(xiàn)又解決了兩個(gè)痛點(diǎn)：
其實(shí) Greasymonkey 也是開(kāi)源的1
這幾款主流的瀏覽器擴(kuò)展的支持情況見(jiàn)下表，如果有不當(dāng)請(qǐng)留言指正。
| 瀏覽器 | Greasymonkey | Tampermonkey | Violentmonkey |
| Chrome | 支持 | 支持 | |
| Edge | 支持 | 支持 | |
| Safari | 支持 | ||
| Firefox | 支持 | 支持 | 支持 |
| Opera | 支持 | 支持 | |
| Vivaldi | 支持 | ||
| Maxthon 遨游 | 支持 | ||
| Dolphin | 支持 | ||
| UC | 支持 |
當(dāng)然了，如果要用嚴(yán)謹(jǐn)一點(diǎn)的定義來(lái)說(shuō)，用戶(hù)腳本其實(shí)是一種注入式的 JavaScript 程序，在網(wǎng)頁(yè)本身的程序之外，通過(guò)一些手段，將用戶(hù)需要的數(shù)據(jù)和邏輯注入到當(dāng)前的網(wǎng)頁(yè)中，達(dá)到修改界面、增加功能等等的目的。
換句話(huà)說(shuō)用戶(hù)腳本也是 JavaScript。JavaScript 能實(shí)現(xiàn)的能力，用戶(hù)腳本基本也能做，比如操作頁(yè)面元素，可以給頁(yè)面中增加、刪減、修改頁(yè)面元素，最常見(jiàn)的去廣告腳本就是這么實(shí)現(xiàn)的。
不過(guò)用戶(hù)腳本能提供一些普通 JavaScript 實(shí)現(xiàn)不了的能力。Greasymonkey 在最早的 0.25 版本中就帶來(lái)了兩個(gè)基本的功能：
這兩個(gè)功能到現(xiàn)在為止仍然非常核心，這里稍微解釋一下背景。
為了安全起見(jiàn)，瀏覽器在頁(yè)面加載的時(shí)候會(huì)有一個(gè)同源策略，如果頁(yè)面中的 javaScript 來(lái)自另一個(gè)域名，瀏覽器就會(huì)認(rèn)為這個(gè)不安全不讓其加載運(yùn)行，但有的時(shí)候用戶(hù)可能會(huì)有一些別的需求。
舉個(gè)例子：比如說(shuō)在京東或者當(dāng)當(dāng)上買(mǎi)書(shū)的時(shí)候，想看一下豆瓣上用戶(hù)的評(píng)分，這種情況下就需要用到用戶(hù)腳本的這個(gè)能力了。在京東的頁(yè)面中，我們就可以借助用戶(hù)腳本調(diào)用這個(gè) GM_xmlhttpRequest 的 API 去訪(fǎng)問(wèn)豆瓣平臺(tái)的查詢(xún)接口。
很多情況下，用戶(hù)腳本不需要自動(dòng)執(zhí)行，而是需要使用者來(lái)手動(dòng)運(yùn)行，這時(shí)就需要 GM_registerMenuCommand 了，在點(diǎn)擊之后，觸發(fā)一個(gè)寫(xiě)好的函數(shù)，就可以完成改變頁(yè)面數(shù)據(jù)，或者發(fā)起某些請(qǐng)求的情況。
舉個(gè)例子：我在頁(yè)面中看到一個(gè)不認(rèn)識(shí)的單詞，想要查詢(xún)一下，這時(shí)候選中這個(gè)單詞，然后觸發(fā)這個(gè)接口，就可以實(shí)現(xiàn)查詢(xún)的效果（當(dāng)然也有很多的別的能力可以實(shí)現(xiàn)劃詞查詢(xún)）。
除了這兩個(gè)功能之外，目前的用戶(hù)腳本，大多采用了 Greasemonkey 制定的 V4 API 規(guī)范。通過(guò)這個(gè)規(guī)范，我們就能知道用戶(hù)腳本可以做什么了。
localStorage 比較像，可以給予用戶(hù)腳本存儲(chǔ)一些數(shù)據(jù)的能力。比如一些個(gè)性化的用戶(hù)設(shè)置（譬如一張可愛(ài)的背景圖）、用戶(hù)數(shù)據(jù)（你關(guān)注的股票和基金）等等。在 V3 版本的 API 中，還多了幾個(gè)能力，包括：
不過(guò)上述的幾個(gè)用戶(hù)腳本擴(kuò)展也出現(xiàn)了一些自己的差異，比如 Tampermonkey 就支持了插入節(jié)點(diǎn)的能力，也支持獲取當(dāng)前標(biāo)簽頁(yè)面信息的能力。
如果你是一個(gè)用戶(hù)腳本開(kāi)發(fā)者，需要注意一下這些差異點(diǎn)。
指望每一個(gè)人都去自己寫(xiě)腳本是不現(xiàn)實(shí)的，這需要大家有一些基本的前端開(kāi)發(fā)能力。大部分的用戶(hù)都是去找一些現(xiàn)成的腳本來(lái)使用，這就是所謂的「腳本源」。
最早期的腳本源，最有名的是 userscript.org 站點(diǎn)，不過(guò)由于維護(hù)不力，導(dǎo)致后面充斥著各種各樣的有害腳本，非常影響大家使用。目前這個(gè)站點(diǎn)已經(jīng)下了，我也沒(méi)有給它加上可以點(diǎn)擊的超鏈接。
如果你想體驗(yàn)，可以訪(fǎng)問(wèn) https://userscripts-mirror.org/ 這個(gè)鏈接來(lái)找到之前的老腳本。
當(dāng)然我更推薦下面的幾個(gè)腳本源：
當(dāng)然，直接在 GitHub 上去找腳本也是個(gè)不錯(cuò)的選擇。
在上面提到的劃詞翻譯這個(gè)例子中我們其實(shí)引入了這樣一個(gè)問(wèn)題：同樣一個(gè)需求，如果瀏覽器擴(kuò)展和用戶(hù)腳本都能實(shí)現(xiàn)，我們應(yīng)該如何選擇？
一方面，瀏覽器擴(kuò)展相比用戶(hù)腳本誕生的時(shí)間其實(shí)更晚，各家的瀏覽器擴(kuò)展后發(fā)制人，的確也有了比用戶(hù)腳本強(qiáng)得多的功能實(shí)現(xiàn)；但另一方面，雖然腳本能力有限，但是它們占用的系統(tǒng)資源和內(nèi)存又更少一點(diǎn)。
另外，從安全性角度上來(lái)說(shuō)，用戶(hù)腳本雖然也爆出過(guò)不少 竊取個(gè)人信息、替換返利鏈接2
因此我自己的解決方案是，對(duì)于輕量一些的場(chǎng)景，通過(guò)用戶(hù)腳本+用戶(hù)樣式（user style）解決大部分瀏覽需求，重一些的場(chǎng)景則會(huì)選擇瀏覽器擴(kuò)展。當(dāng)然了，如果你的設(shè)備對(duì)保密性和安全等級(jí)有著較高的要求，我還是不建議你安裝任何用戶(hù)腳本。
用戶(hù)腳本作為一個(gè) 17 年前的互聯(lián)網(wǎng)老古董，現(xiàn)如今仍有自己的用武之地，還是十分令人感慨。但作為油猴使用指南的第一期，本文僅為增加大家對(duì)「油猴腳本」的一點(diǎn)了解，如果你想解鎖用戶(hù)腳本的全部實(shí)力、甚至自己動(dòng)手制作用戶(hù)腳本，還請(qǐng)留意本系列的后續(xù)內(nèi)容更新。
> 下載 少數(shù)派 2.0 客戶(hù)端、關(guān)注 少數(shù)派公眾號(hào)，解鎖全新閱讀體驗(yàn) ??
> 實(shí)用、好用的 正版軟件，少數(shù)派為你呈現(xiàn) ??
