上傳自己的 Chrome 擴充功能與停止 Chrome 擴充功能自動更新

Jeff Hsieh
5 min readDec 9, 2019

--

封面照放個我大阿炸哥

之所以會有這篇,是因為我有在玩 FIFA 系列遊戲(雖然最近有點半退坑),而我有用到一個 Chrome 的擴充功能來幫助我遊戲玩得更順暢,然而最近這個擴充功能的開發者宣布不再繼續更新了,也會把這個擴充功能下架,最新的版本則會 disable 掉所有的功能。

登冷,我馬上開 Chrome 來檢查這個擴充功能,發現我的 Windows 電腦中,這個擴充功能已經被更新到最新版而無法使用了,但是 Mac 的電腦中則還是可以使用的舊版本

好的所以該做的事情有兩件,第一個是想辦法讓我的 Windows 有擴充功能可以使用,第二個是讓 Mac 的擴充功能不要更新到最新版

先來進行第一件事,我嘗試過到這個網站去找舊版本的 CRX 檔,然而載下來的 CRX 檔案卻都不能安裝,於是最後決定到作者的 github 把整個擴充功能的原始碼抓下來,再放到自己的 Chrome 上面

要放擴充功能到 Chrome 上其實步驟很簡單,首先進入到 chrome://extensions/ ,也就是擴充功能管理頁面中,接著會在右上角看到「開發人員模式」的開關,將它打開後會發現介面有點改變

打開後的樣子

會發現左邊多了三個按鈕,我們會用到的是「載入未封裝項目」,旁邊的「封裝擴充功能」估計是你想要把你開發的擴充功能推上 Chrome 官方商店時會用到的,我們需要的只是自己可以使用就好,因此就不管他了

點開後會開檔案總管讓你選擇擴充功能所在的資料夾,選完就會自動匯入,匯入時 Chrome 會自動檢查你的擴充功能是否有符合所需的目錄結構,基本上必須要有叫做 js 的資料夾,裡面放著 eventPage.js 檔案,另外還需要 manifest.json 以及 icon 的 png 等等

由於這包原始碼本身就是個擴充功能,抓下來用 npm 打包後,作者已經自己整理好該有的結構跟東西了,因此我不用再費神去滿足目錄結構的需求,如果你是要自己寫擴充功能,那就得去詳閱一下 Chrome 的文件囉

第一件事情基本上這樣就結束了,如果檔案都有符合擴充功能的規範的話,「載入未封裝項目」完就可以直接使用囉!

再來是第二件事,停止擴充功能自動更新

查到一些網路上的解法會説,到 chrome://plugins/ 裡面可以選擇關閉所有的擴充功能更新,但這不是我們想要的做法,首先,我們需要的只是讓特定的擴充功能不要更新而已,其他的希望還是可以正常更新運作,再來,這個頁面在比較新的版本 Chrome 也已經移除了,因此需要另外的方式

首先我們還是需要到擴充功能管理頁中打開「開發人員模式」,打開後會發現擴充功能們多顯示了一個 ID

每個擴充功能有各自的 ID

這些 ID 就是每個擴充功能各自的識別,有了這組 ID 後我們就可以來到 Chrome 存放擴充功能的目錄,不同電腦跟不同 OS 的位置可能不一樣,以 Mac 為例,我在網路上找到的路徑是説放在 ~/Library/Application Support/Google/Chrome/Default/Extensions 裡面,然而實際上在我的電腦中路徑是 ~/Library/Application Support/Google/Chrome/Profile 1/Extensions 裡面,而因為 Chrome 是用上面的 ID 當資料夾名稱的,所以如果找不到的話可以直接用搜尋的功能搜尋上面的 ID,就能夠順利找到擴充功能的資料夾

找到後點進去該資料夾,會看到裡面會根據不同版本號而有各自的資料夾,選擇最新的版本點開後,會在裡面找到 manifest.json 檔案,這個檔案就是 Chrome 在管理每個擴充功能時會使用到的

manifest.json 的內容

打開 manifest.json 就會看到一串 JSON 內容,其中的 update_url 就是我們要動手腳的地方了,我們需要把這個網址改成一個無效的網址,例如 http://localhost/ 這樣,如此一來,當 Chrome 要更新這個套件時就無法找到正確的更新網址並得到內容,自然也就不能更新囉

以上就是關於擴充功能的一些實作,下次遇到想要的擴充功能怕他消失,就可以備份起來自己裝或是強迫他不要更新囉!

嘛,除了工作以外,能夠實際用到程式技能來解決自己生活上的問題,也是身為工程師的一大好處XD

參考文章:
http://pnperl.blogspot.com/2015/07/disable-google-chrome-extensions-auto.html
https://stackoverflow.com/questions/27657617/how-to-disable-google-chrome-extension-autoupdate
https://stackoverflow.com/questions/5862215/what-is-a-manifest-json-file-and-where-can-i-find-it-on-my-machine
https://stackoverflow.com/questions/6176596/where-does-chrome-store-userscripts-user-js-files-on-a-mac

--

--

Jeff Hsieh

資深後端工程師,熟悉JAVA與現代網頁後端技術與框架,並具備金融市場交易知識