如何在弹出页面和背景页面之间进行通信并存储我已经获得的信息?

我正在制作一个谷歌浏览器扩展程序,以便为不同的url(标签)提供具体信息(通过服务器端的ajax)。

我在background.js使用chrome.tabs.onUpdatedchrome.tabs.onActivated事件侦听器来检测活动选项卡的url是否已更改,然后使用chrome.browserAction.setIcon发送ajax请求以更改图标。 (是的,我想使用浏览器操作而不是页面操作,因为我想在弹出页面中显示扩展的一些整体信息,比如Adblock Plus )

但是,我无法弄清楚的是:

  1. 我如何在后台和弹出页面之间进行通信? 我知道我应该使用chrome.tabs.sendMessage()chrome.runtime.onMessage在后台和内容脚本之间进行通信,但是如何在前者和弹出脚本之间进行通信? 我看不出我需要内容脚本来修改页面的内容。
  2. 如何在每个页面的弹出页面中“存储”我已经获得的信息,这样当用户更改激活的选项卡但不更改url时,我不需要再发送更少的请求?

任何的想法? 提前致谢!

对于问题#1,由于后台页面和弹出页面都在扩展过程中,它们可以直接相互通信,如设置变量或调用函数。 您可以查看以下两篇文章:

  • 如何在chrome扩展中的popup.js和background.js之间进行通信?
  • 如何从弹出窗口中与background.js进行交互?

至于问题#2,

  1. 在学习了如何在弹出页面和后台页面之间进行通信之后,您可以将弹出页面中检索到的信息保存在后台页面中,并记住在manifest.json设置persistent: true ,它将确保后台页面贯穿整个扩展生命周期。
  2. 您还可以使用chrome.storage或localStorage api来存储数据。 您可以将数据保存在一个页面中,并可以在另一个页面中自由访问(因此,这也是在某种程度上在两个页面之间进行通信的方式)