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);