想做个采集功能，发现目标网站的数据使用ajax加载。用php做采集并不能很好的实现，于是想到使用浏览器插件。

值得庆幸的是，现在很多国内浏览器都使用chrome内核，文档也相对多些，比如360浏览器，百度浏览器。在查找这些资料时，却是找到不少，以下是资料链接。

图灵社区：Chrome扩展及应用开发（http://www.ituring.com.cn/minibook/950）

百度浏览器 Javascript API（https://chajian.baidu.com/developer/extensions/api_index.html）

360安全浏览器应用开发平台（http://open.se.360.cn/open/extension_dev/tut_debugging.html）

建议：直接查看百度浏览器插件开发入门（https://chajian.baidu.com/developer/extensions/getstarted.html）。跟着实例做，他们还提供实例源码下载。后来只需要查看百度浏览器 Javascript API（https://chajian.baidu.com/developer/extensions/api_index.html）来开发了。

开发一个插件第一步：清单文件

清单文件是一个json格式的文件，定义了扩展的信息、权限以及所引用的资源。

清单文件格式详解在这：https://chajian.baidu.com/developer/extensions/manifest.html

一般的一个清单文件具有，扩展名、扩展描述、manifest_version、版本号、图标、权限、background、content_scripts等。

下面是我插件的manifest.json。

{
“manifest_version”: 2,
“name”: “网页采集”,
“version”: “1.0”,
“description”: “专为桃心美图网开发，用于数据采集”,
“permissions”: [
“contextMenus”,
“notifications”,
“webRequest”
],
“background”:{
“page”:”background.html”
},
“content_scripts”: [
{
“matches”: [“*://*/*”],
“js”: [“js/zepto.min.js”,”js/content.js”]
}
]

}

开发一个插件第二步：后台页面（脚本）

这个文件会运行在后台，用来处理一些长时间运行的任务和状态。我在background.html引用了background.js文件，在background.js文件中创建了一个右键菜单。

开发一个插件第三步：页面脚本

页面脚本是用来编写脚本的，浏览器插件会将页面脚本注入到浏览器页面。我在content_scripts中编写了操作页面dom的脚本。

开发一个插件第四步：通信

因为安全策略和权限的因素，后台是不能直接在页面执行脚本的。比如我要实现点击右键菜单改变DOM元素，或者获得当前页面url，后台脚本都是不能做到的。只有通过内容脚本实现，后台脚本和内容脚本又不可直接调用。所以才有了通信，使用chrome.tabs.sendMessage发送信息，使用chrome.runtime.onMessage.addListener接收信息，完成通信。

转载请注明：三只源码 » 如何快速掌握并开发谷歌浏览器插件