Content脚本与扩展的其他页面脚本的消息传递

我正在实现一个Chrome浏览器扩展来解析某社交网站的数据（也就是扒网页）。点击扩展的图标，它将会pop up出一个气泡窗口，上面显示当前解析的结果。解析的工作由content page的一个javascript脚本负责。更具体的数据流程是：点击图标出现气泡窗口(popup.html)，气泡窗口的javascript脚本(popup.js)将发送一个消息给content page的脚本(content.js)，content.js计算解析content page（即社交网站）得到结果，将其通过消息回调函数返回给popup.js，然后popup.js再把结果显示到popup.html上，气泡窗口上就能看到扒网页的结果了。

这里消息的发送方popup.js使用了chrome.tabs.query函数和chrome.tabs.sendMessage函数，具体代码如下：

chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    chrome.tabs.sendMessage(tabs[0].id, {message:"calculate"}, function(response) {
		var result = document.createElement("div")
		result.textContent=response.result
		document.body.appendChild(result)
    });  
});

chrome.tabs.query函数用来定位当前标签页，因为chrome.tabs.sendMessage需要明确指出消息发送给谁（第一个参数）。消息的内容是第二个参数，一个json对象。

方法体里面的三行其实是回调函数的内容，也就是popup.js得到content.js的回复后执行的操作：将结果添加到气泡窗口popup.html中。

需要指出的是谷歌官方的开发文档和示例里用的是chrome.tabs.getSelected函数和chrome.extension.sendRequest函数，这两个函数在新的Chrome里已经废弃了。

消息的接收方content.js实现了消息监听器，具体代码如下：

chrome.extension.onMessage.addListener(
  function(request, sender, sendResponse) {
  	if (request.message == "calculate")
		sendResponse({result: calculate()})
	else
		sendResponse({result: "不告诉你"})
  });

calculate函数在content.js里实现，返回值是解析的结果，也是一个json对象。

和前述一样，监听器从前用chrome.extension.onRequest，现在用chrome.extension.onMessage。

其实消息只是发送给了该扩展的content page，并没有指出是哪个脚本。如果有多个脚本的话，谁实现了onMessage监听器谁就能接收到消息。如果多个脚本都实现了onMessage监听器呢？那就不知道谁会抢到了，应该只有一个监听器能得到消息吧，因为这种实现消息传递的方法是一次性的，用过即销毁。若要长期连接，还得用port对象和connect函数。