在Chrome扩展程序中查看背景HTML页面

时间:2017-07-07 19:28:49

标签: javascript html google-chrome google-chrome-extension

我正在开发Chrome扩展程序。目的是显示从页面上的多个服务器收集的数据。我正在利用Chrome扩展程序在PC启动时作为后台进程运行,以便始终收集数据。

的manifest.json

{
   "manifest_version": 2,

   "name": "Data Hub",
   "description": "This extension gathers and analyzes data from several servers",
   "version": "1.0",

   "browser_action": {
      "default_icon": "icon.png",
      "default_popup": "popup.html"
   },
   "background": {
      "page": "background.html"
   },
   "permissions":[
      "background"
   ],
}

Popup.html Popup.js

单击弹出图标时打开Background.html的新实例。

Work.js

无限循环:发出AJAX请求,处理数据并更新Background.html。脚本位于我的扩展程序的文件夹中。

Background.html

每个实例都调用自己的Work.js实例。

如果单击弹出窗口,则会在新选项卡中打开Background.html的新实例。我可以在chrome://extensions/中看到,现在有2个Background.html实例。它开始显示从此时刻开始的数据,我可以看到页面的HTML元素。当选项卡关闭时,该数据将丢失。

我希望能够看到原始Background.html页面的HTML元素。原始实例自启动以来一直在运行,并在Chrome关闭时继续运行,因此它包含所有数据。

chrome://extensions/点击查看Background.html的原始实例时,我只能看到开发者工具,而不是页面上的HTML元素。

1 个答案:

答案 0 :(得分:1)

仅仅因为文件名为background.html,当您在选项卡中打开它时,它不会成为后台页面。它变成了另一个具有自己的上下文,文档,窗口的页面 - 它只存在于该选项卡关闭之前。扩展只有一个真实的背景页面,它在manifest.json的"background"部分中声明。

请务必阅读extensions architecture overview并重新编写代码。您可以在chrome.storage.local中保留数据,也可以在扩展程序的其他页面中使用chrome.extension.getBackgroundPage()来访问将公开全局变量和函数的真实且唯一的后台页面window