javascript - 如何从 Chrome 扩展中的弹出窗口访问后台页面中的对象

标签 javascript google-chrome google-chrome-extension

在我正在开发的 Chrome 扩展程序中,我想在单击弹出窗口时访问在后台页面中创建和维护的数据结构。不幸的是,我是 Javascript 和 Chrome 扩展开发的新手,你能告诉我该怎么做吗?这是否涉及弹出窗口和后台页面之间的消息传递? 谢谢。

最佳答案

你可以写三个这样的文件来从你的 popup.html 访问 background.html 中的数据结构:


//in popup.html
<script type="text/javascript" src="mainscript.js"></script>
<!-- JavaScript and HTML must be in separate files for security. -->

//in mainscript.js
chrome.extension.getBackgroundPage().data = 'your data';

//in background.html
<script type="text/javascript">
var data;
</script>

并且您需要这样的 manifest.json(可能使用 browser_action 而不是 page_action):

....
,
"background_page": "background.html",
"page_action": {
    "default_icon": "your_icon.ico",
    "default_title": "Your title",
    "default_popup": "popup.html"
  },
....

编辑:对于 chrome 扩展中的消息传递,请参阅这些函数

http://code.google.com/chrome/extensions/extension.html#method-sendRequest

http://code.google.com/chrome/extensions/extension.html#event-onRequest

和这个有用的描述:

http://code.google.com/chrome/extensions/messaging.html

关于javascript - 如何从 Chrome 扩展中的弹出窗口访问后台页面中的对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10987211/

相关文章:

javascript - angular.extend 在 Angularjs 应用程序中无法合并 2 个数组

google-chrome - chrome.webNavigation.onTabReplaced 不触发

css - chrome 页脚重叠内容尽管清晰 :both used

Angular Chrome Api 数据绑定(bind)不起作用

javascript - 使用 setAttribute (javascript) 设置字体/字体系列

javascript - CKfinder 和 Codeigniter 浏览服务器

javascript - 从父组件 react hooks 更改子组件的 useState

javascript - 如何从网页打开 Chrome 扩展选项页面?

google-chrome - Chrome 扩展 : open an website with different account in each tab

javascript - 如何手动拖动和调整图像直到它适合css中的特定框