基本组成
这里讲的是开发一个扩展（插件）最常用最基本的所需的东西，并不像官方说的那种分类。
- manifest.json
- background script
- content script
- popup
1、background script
background可以理解为插件运行在浏览器中的一个后台网站/脚本，注意它是与当前浏览页面无关的。
实际上这部分内容的配置情况也会写在manifest里，对应的是background配置项。单独拿出来讲，是彰显它的分量很重，也是一个插件常用的配置。从其中几个配置项项去了解一下什么是background script
2、content script
简单来说是插入到网页中的脚本。它具有独立而富有包容性。
js
要插入到页面里的脚本。例子很常见，例如在一个别人的网页上，你要打开你做的扩展，对别人的网页做一些处理或者获取一些数据等，那怎么跟别人的页面建立起联系呢？就是通过把js里的这些脚本嵌入都别人的网页里。
3、popup
就是在manifest里的browser_action与page_action配置项里设置的
基础的通信机制
上面讲述了基本的组成部分，那么这几部分，他们要进行交流合作，把他们组织起来，才能成就一个漂亮的扩展。那么这种交流，分为以下几种说明：
- content script与background的通信
- popup与background的通信
- popup与content script的通信
- 插件iframe网站与插入网页的通信
1、content-script与background通信
content-script与background通信发送消息
在content-script端
使用
chrome.runtime.sendMessege(
message,
function(response) {…}
)
复制代码
就能向background发送消息了，第一个参数message为发送的消息（基础数据类型），回调函数里的第一个参数为background接收消息后返回的消息（如有）
在background端
使用
chrome.runtime.onMessege.addListener(
function(request, sender, sendResponse) {…}
)
复制代码
进行监听发来的消息，request表示发来的消息，sendResponse是一个函数，用于对发来的消息进行回应，如 sendResponse('我已收到你的消息：'+JSON.stringify(request));
这里需要注意的是，默认情况下sendResponse函数的执行是同步的，如果在这个监听消息的处理函数的同步执行流程里没有发现sendResponse，则默认返回undefined，假设我们是要经过一个异步处理之后才调用sendResponse，已经为时已晚了。因此，我们可能需要异步执行sendResponse，这时我们在这个监听函数里的添加return true就能实现了。
还有，由于background监听所有页面上的content script上发来的消息，如果多个页面同时发送同种消息，background的onMessage只会处理最先收到的那个，其他的不了了之了。
background向content-script发送消息
在background端
首先我们需要知道要向哪个content scripts发送消息，一般一个页面一份content scripts，而一个页面对应一个浏览器tab，每个tab都有自己的tabId，因此首先要获取要发送消息的tab对应的tabId。
/**
* 获取当前选项卡id
* @param callback - 获取到id后要执行的回调函数
*/
function getCurrentTabId(callback) {
chrome.tabs.query({active: true, currentWindow: true}, function (tabs) {
if (callback) {
callback(tabs.length ? tabs[0].id: null);
}
});
}
当知道了tabId后，就使用该api进行发送消息
chrome.tabs.sendMessage(tabId, message, function(response) {...});
复制代码
其中message为发送的消息，回调函数的response为content scripts接收到消息后的回传消息
在content scripts端
同样是使用
chrome.runtime.onMessege.addListener(function(request, sender, sendResponse) {…})
复制代码
进行来自background发来消息的监听并回传
2、popup与background的通信
一般地，popup与background的交流，常见于popup要获取background里的某些“东西”，当然我们可以使用上述的chrome.runtime.sendMessage和chrome.runtime.onMessage的方式进行popup向background的交流，但是其实有更方便快捷的方式：
var bg = chrome.extension.getBackgroundPage();
bg.someMethod(); //someMethod()是background中的一个方法
复制代码
3、popup与content script的通信
这里的通信，实际上跟background与content script的方式是一样的
