chrome插件的开发其实并不难,看着官方文档来开发一般都不会有太大的问题;这里我主要整理下插件中多个页面之间通信的问题;
插件有哪几个部分
插件一般有popup页,background页,以及content scripts脚本组成。
- popup页是在插件图标被点击时,弹出的窗口页面
- background页是用于管理插件的任务和状态,可以认为是负责插件的主逻辑
- content scripts是一段插入web页面的脚本,运行在web页面的上下文中,使用标准的Dom接口,可以读取web页面的细节或者修改页面Dom结构;
插件运行上下文相关页面通信
popup和background都运行在插件的上下文中,或者往大了讲,所有的插件页面都运行在同一个线程中,所以他们之间通信相对比较简单,页面之间可以直接相互调用方法来传递信息;但是需要先获取页面的引用,如下api可以取得引用
- chrome.extension.getViews()方法可以获取插件内任意页面的引用
- chrome.extension.getBackgroundPage()方法可以获取background页面的引用
获取的引用其实是每个页面对应的window是对象,你可以通过window对象直接调用页面内的全局方法来与窗口对象对应的页面进行通信;
-- getViews Api参见
https://developer.chrome.com/extensions/extension#method-getViews
-- getBackgroundPage参见
https://developer.chrome.com/extensions/extension#method-getBackgroundPage
-- 插件内页面通信说明参见
https://developer.chrome.com/extensions/overview#pageComm
content scripts与插件上下文页面通信
content scripts是嵌入web页面脚本,所以它实际上运行在web页面上下文中,与插件运行上下文是完全隔离的,没办法像插件上下文页面之间相互调用方法就可以实现通信,需要通信通道来辅助;
有两种通信方式,一种是单向的,一种是双向的。