google-chrome - Chrome 扩展无法访问自定义窗口属性

Question

我正在尝试编写一个具有开发工具面板的 Chrome 扩展程序。这个扩展需要调用我也制作的网页中窗口属性上定义的函数。换句话说，扩展仅适用于我自己的网页，我控制两者。示例:

// This script is added in my own webpage application when it loads
window.myTest = () => { /* do something */ }

我希望能够从我的 Chrome 扩展中调用函数 window.myTest。我需要制作类似的功能，如 https://github.com/zalmoxisus/redux-devtools-extension .

看来我需要通过从我的后端页面注入(inject)脚本/代码来做到这一点。我的所有工作都已完成，带有被调用的后端页面的扩展，我可以看到我注入(inject)的代码在页面上下文中被调用(通过 console.log 进行的测试被写入页面的控制台输出)。

这是我的代码:

list .json

{
  "manifest_version": 2,

  "name": "MyTest",
  "description": "MyTest",
  "version": "0.0.1",

  "minimum_chrome_version": "10.0",

  "devtools_page": "devtools.html",

  "background": {
    "scripts": ["background.js"]
  },

  "content_scripts": [{
    "matches": ["<all_urls>"],
    "js": ["testscript.js"]
  }],

  "permissions": [
    "tabs",
    "<all_urls>"
  ]
}

测试脚本.js

window.myTest(); // myTest is undefined in the context of the injected script

背景.js

// empty, but here to be able to open background page

我还有一个面板，它在单击按钮时向后台页面发送消息。我知道面板和发送消息也有效。但是 window.myTest 仍然是 undefined。

编辑从 background.js 中删除了注入(inject)，因为我没有使用它并且遇到了与描述相同的问题。

Answer 1

最后，我得到了这方面的规范。 Mozilla 和 Chrome 遵循相同的扩展规范。

内容脚本获得 DOM 的“干净” View 。这意味着:

• 内容脚本无法看到页面定义的 JavaScript 变量脚本。
• 如果页面脚本重新定义了内置 DOM 属性，则内容脚本看到属性的原始版本，而不是重新定义的版本。

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_scripts