我正在使用具有许多内容脚本的Chrome扩展程序。他们中的大多数使用相同的功能,因此我想在内容脚本之间共享这些功能。但是我似乎不知道该怎么做。
内容脚本是沙盒化的,因此无法访问同一window
对象。似乎应该有一个明显的解决方案,但我一直找不到。
实际情况并非如此:内容脚本无法与window
加载它们的页面对象进行交互,但是它们共享相同的隐藏window
对象。因此,如果将两个不同的内容脚本加载到同一页面中,则两个内容脚本都将使用相同的隐藏window
内容。
这是一个示例,请自己尝试,然后执行以下操作:
样本manifest.json
:
{
"manifest_version": 2,
"name": "My extension",
"permissions": ["*://*/*"],
...,
"content_scripts": [
{
"matches": ["*://*/*"],
"js": ["one.js", "two.js"]
}
]
}
one.js
具有以下功能的脚本:
function sayHello(name) {
alert("Hello " + name + "!");
}
two.js
使用该功能的脚本:
sayHello('John');
这很容易告诉:
one.js
脚本注入第一和定义sayHello
功能two.js
,注入的其他任何内容脚本one.js
都可以使用该功能sayHello('John');
将提醒“约翰你好!” 如预期的那样。这就是为什么大多数开发人员(我也是)喜欢这样做的原因:
"content_scripts": [
{
"matches": ["*://*/*"]
"js": ["jquery.min.js", "script.js"]
}
]
因为这是包含jQuery并将其与内容脚本一起使用的简便方法。
显然,内容脚本window
即使使用chrome.tabs.executeScript()
功能从后台页面注入,也将共享同一对象。
您可以轻松地创建一个包含所有实用程序和最常用功能的脚本,因此,您将随时准备在第一个脚本之后注入的任何其他内容脚本中使用它们。
因此,基本上,做这样的事情:
"content_scripts": [
{
"matches": ["*://*/*"]
"js": ["script1.js", "script2.js", "script3.js", ...]
}
]
意思是:
script1.js
被注射script2.js
被注入并继承 script1.js
script3.js
注入和继承的命名空间script2.js
和script1.js
当Google文档说:
内容脚本在称为隔离世界的特殊环境中执行。他们有权访问所注入页面的DOM,但不能访问该页面创建的任何JavaScript变量或函数。看起来每个内容脚本都好像在其上运行的页面上没有其他JavaScript执行。反之亦然:在页面上运行的JavaScript无法调用任何函数或访问由内容脚本定义的任何变量。
这意味着:
但是:
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句