1. 程式人生 > 其它 >開啟瀏覽器指定谷歌_Chrome擴充套件開發-編寫一個瀏覽器外掛

開啟瀏覽器指定谷歌_Chrome擴充套件開發-編寫一個瀏覽器外掛

技術標籤:開啟瀏覽器指定谷歌

谷歌瀏覽器外掛是一種小型的用於定製瀏覽器體驗的程式。通過外掛,可以自定義瀏覽器的一些行為來適應個人的需要,只要你會HTML,JavaScript,CSS就可以動手開發瀏覽器外掛了。

開發谷歌瀏覽器外掛,就相當於在谷歌瀏覽器的基礎之上進行活動,站在巨人的肩膀上,操作很多東西都方便了一些。有了外掛,我們可以定製js爬蟲、遮蔽網頁廣告,網頁實時查詞,修改http請求頭,等等,能做的東西很多。

配置檔案

每個擴充套件都有一個JSON格式的mainifest檔案,叫mainifest.json。

{     "manifest_version": 2, //固定的    "name": "Cissy's First Extension", //外掛名稱    "version": "1.0", //外掛使用的版本    "description": "The first extension that CC made.", //外掛的描述    "browser_action": { //外掛載入後生成圖示        "default_icon": "cc.gif",//圖示的圖片        "default_title": "Hello CC", //滑鼠移到圖示顯示的文字         "default_popup": "popup.html" //單擊圖示執行的檔案    },     "permissions": [ //允許外掛訪問的url        "http://*/",         "bookmarks",         "tabs",         "history"     ],     "background":{//background script即外掛執行的環境        "page":"background.html"        // "scripts": ["js/jquery-1.9.1.min.js","js/background.js"]//陣列.chrome會在擴充套件啟動時自動建立一個包含所有指定指令碼的頁面    },      "content_scripts": [{  //對頁面內容進行操作的指令碼         "matches": ["http://*/*","https://*/*"],  //滿足什麼條件執行該外掛          "js": ["js/jquery-1.9.1.min.js", "js/js.js"],            "run_at": "document_start",  //在document載入時執行該指令碼    }] }注⚠️:Chrome不允許擴充套件中的html頁面內直接內嵌js指令碼,而要求所有的指令碼都作為外部的src引入。

簡單的瀏覽器外掛基本檔案組成

ae0f4cba0a9e1687e65060d2e71eb2fc.png

安裝除錯

設定 —>拓展程式—>載入已解壓的拓展程式—>選擇檔案就行了,記得要開啟開發者模式~~


原文連結:https://www.jianshu.com/p/51c650f98d9c + https://segmentfault.com/a/1190000006949838

生活總是不容易的,但生而為人,請善良、請開心 ---時光無法後退,生命只有一次。