chrome插件開發-頁面通信

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頁面上下文中,與插件運行上下文是完全隔離的,沒辦法像插件上下文頁面之間相互調用方法就可以實現通信,需要通信通道來輔助;
有兩種通信方式,一種是單向的,一種是雙向的。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容