在“孤立的世界”中运行javascript(chrome)

eeq64g8w 于 2023-03-10 发布在 Go

关注(0)|答案(4)|浏览(115)

我开发的chrome扩展通过HTML导入将Polymer和其他Web组件注入到主机页面中，而不是使用内容脚本的典型方法-内容脚本在isolated world中自动运行。
这背后的原因与两件事有关：

Chrome扩展无法注册来自content scripts的自定义元素
chrome扩展清单不支持在隔离环境中运行的HTML导入，只支持javascript
由于这些限制，我不得不将组件作为described here加载到主机页面的<head>中。
我面临的一个明显的问题是我的javascript与主机页面的javascript（在某些网站上）发生冲突，因为我用来注入依赖项的方法不能在一个“孤立的世界”中运行。
到目前为止，我已经解决了大部分这些问题，有一个狼吞虎咽的任务重命名聚合物&我的组件，以避免冲突，但不幸的是，它并不完美，需要一个更强大的方法。
最后对我的问题：有没有可能为我的javascript创建一个“隔离的世界”？也许是另一个文档对象？如果没有，有没有什么策略可以确保我的代码在隔离中运行？

更新日期：

你们中的一些人建议使用IIFE，这也是我目前一直在使用的。我正在寻找一个答案，沿着一个孤立的世界的路线，类似于谷歌浏览器下运行扩展。这主要是因为聚合物必须附加到全局窗口对象。

google-chrome

来源：https://stackoverflow.com/questions/36137194/run-javascript-in-an-isolated-world-chrome

4条答案

按热度按时间

ruoxqz4g1#

你可以用a closure来限定变量（包括函数，因为它们是javascript中的第一类对象）的范围。
所以如果你在下面的代码中插入IIFE -立即调用函数表达式-

var someVar = 'this one "conflicts" with page js';
(function(){
    var someVar = 'this one does not "conflict" with page js'; //shadows someVar above
    console.log(someVar);
})();
console.log(someVar);

你会发现访问someVar返回了不同的值。
作为注入代码的一部分，您可以像Polymer那样隐藏“冲突”变量。
使用类似CommonJS require()的命令在IIFE中导入所需的版本，并继续从父作用域访问其他内容。

赞(0）回复(0）举报 2023-03-10

b4lqfgs42#

为了便于定义：

孤立的作用域

被广泛地称为IIFE's，这是一种用于javascript“闭包”的设计模式。

孤独的世界

或者“孤立的世界”，正如这个问题的作者@dipole_moment所描述的，javascript应用程序运行在同一个环境中，但彼此不知道。

可能的答案

这个问题可能已经得到了解答。
"我的建议"
虽然“孤立的世界”在javascript中不是一个“东西”，或者至少直到最近才是，但本着提供一个可能的解决方案的精神，我们来看一下Dynamic Script Loading。
如果您没有动态地将脚本加载到“* 隔离的作用域 *”中，并在该作用域中使用函数，那么您仍然会遇到冲突。

赞(0）回复(0）举报 2023-03-10

hivapdat3#

不管怎样，iframe是非常孤立的：）
不要将Polymer直接添加到主机页面<head>，而是尝试在主机页面中创建一个<iframe>，并将Polymer和其他Web组件添加到内部<iframe>文档。
您可以动态创建<iframe>内容，也可以尝试在扩展中引用（src=""）一个HTML文件（不确定，SOP可能会碍事）。
(You可以使iframe透明并将其覆盖在任何您想要的位置）。
希望这能起作用/有帮助。