Chrome 扩展:如何将面板 Window 的数据发送到 Popup?
Chrome Extension: How to send data from Panel Window to Popup?
我正在开发 Chrome 扩展程序,单击扩展程序图标会弹出一个 window(popup.html
),其中包含视频播放按钮。单击该按钮将打开另一个按钮,该按钮是使用 panel
类型的 window.create
创建的。单击 popup.html
上的 PLAY 按钮会执行以下操作:
- 启用DIV
- 通过使用名称
mypanel.html
调用 window.create
创建新的 window。它使用 panel.js
进行 ajax 调用和 DOM 更改功能。
- 拨打Ajax电话,获取数据并播放视频
现在情况是,我通过 AJAX 调用 panel.js
获得的数据。我想将该数据发送回 pop.html
,它本身正在使用文件 popup.js
。 如何将数据从面板 window 发送回 Popup Window?
Messaging documentation 中描述了扩展各部分之间通信的标准方法。
但是,您需要记住,一旦弹出窗口关闭,它就会被卸载,JavaScript 上下文也会随之销毁。所以它在关闭时无法接收消息,并且在重新打开时会丢失所有状态。
有两种解决方法:
您可以使用 background page 来保持状态(如果设置为持久性)并在扩展的各个部分之间路由消息,例如弹出窗口可以在打开时请求当前状态。 这是一个老式的解决方案。
如果您只需要 pass/persist 一些数据,您可以轻松使用 chrome.storage.local
to do it. You can save data with panel.js
and react to changes with chrome.storage.onChanged
event。额外的好处是,当弹出窗口重新打开时,它可以简单地读取存储以构建其初始状态。
我正在开发 Chrome 扩展程序,单击扩展程序图标会弹出一个 window(popup.html
),其中包含视频播放按钮。单击该按钮将打开另一个按钮,该按钮是使用 panel
类型的 window.create
创建的。单击 popup.html
上的 PLAY 按钮会执行以下操作:
- 启用DIV
- 通过使用名称
mypanel.html
调用window.create
创建新的 window。它使用panel.js
进行 ajax 调用和 DOM 更改功能。 - 拨打Ajax电话,获取数据并播放视频
现在情况是,我通过 AJAX 调用 panel.js
获得的数据。我想将该数据发送回 pop.html
,它本身正在使用文件 popup.js
。 如何将数据从面板 window 发送回 Popup Window?
Messaging documentation 中描述了扩展各部分之间通信的标准方法。
但是,您需要记住,一旦弹出窗口关闭,它就会被卸载,JavaScript 上下文也会随之销毁。所以它在关闭时无法接收消息,并且在重新打开时会丢失所有状态。
有两种解决方法:
您可以使用 background page 来保持状态(如果设置为持久性)并在扩展的各个部分之间路由消息,例如弹出窗口可以在打开时请求当前状态。 这是一个老式的解决方案。
如果您只需要 pass/persist 一些数据,您可以轻松使用
chrome.storage.local
to do it. You can save data withpanel.js
and react to changes withchrome.storage.onChanged
event。额外的好处是,当弹出窗口重新打开时,它可以简单地读取存储以构建其初始状态。