Chrome擴展學習總結

資料	谷歌官方文檔 ；360極速瀏覽器開發文檔；百度瀏覽器開發文檔；
manifest.json	http://open.chrome.360.cn/extension_dev/manifest.html https://chajian.baidu.com/developer/extensions/manifest.html#overview.html 【推薦】
chrome.storage	https://chajian.baidu.com/developer/extensions/storage.html#property-managed
chrome.tabs	https://chajian.baidu.com/developer/extensions/tabs.html#method-create
background.js	跨域獲取資源信息儘可能的寫在background.js裏面。 在content裏面需要獲取資源信息的時候通知background去獲取。 https://www.chromium.org/Home/chromium-security/extension-content-script-fetches【需翻牆】
content_script.js	content_script.js有一些限制： 除了以下 API可以調用，其他 chrome.* API都不能調用： extension（getURL、inIncognitoContext、lastError、onRequest、sendRequest） i18n runtime（connect、getManifest、getURL、id、onConnect、onMessage、sendMessage） storage 不能使用所屬應用頁面中定義的變量或函數 不能使用網頁或其他內容腳本中定義的變量或函數

 

1、Chrome擴展文件位置

Chrome擴展文件以.crx爲後綴名，在Google Chrome擴展官方網站下載擴展時，一般會下載到目錄C:\Users\用戶名\AppData\Local\Google\Chrome\User Data\Default\Extensions  下圖中是“Postman”擴展目錄的截圖：

可以看見：一個 Chrome擴展是一個配置（入口）文件 manifest.json 和一系列 html、css、js、圖片文件的集合，然後將代碼使用Chrome打包成crx文件。

2、chrome調試和打包（假設已創建好項目）

打開瀏覽器右上角設置圖標 > 更多工具 > 擴展程序

加載擴展項目後，瀏覽器右上角就出現我們的插件了，可以進行測試了，如果修改了代碼，點擊“重新加載(Ctrl + R)” 後可重新測試。

 

項目開發完成後，需打包成 .crx 插件包。

步驟：勾選開發者模式 → 點擊“打包擴展程序” → 選擇擴展程序根目錄 → 確定打包 → 打開電腦中擴展程序根目錄文件夾，將裏面剛剛打包生成的crx文件拖到 Chrome擴展程序頁面中，即可完成安裝。

 

 

 

3、調試background.js

點擊背景頁，在控制檯打印出chrome的詳細信息：console.log('chrome', chrome);