Question

我正在尝试使用CrossRider创建Chrome扩展程序，并且正在努力创建一个全局变量。

如果单击一个按钮，我的扩展本质上会动态地将一些JavaScript文件附加到页面上，我还需要它来创建一个全局变量并设置一些属性。

我尝试了以下内容：

appAPI.ready(function($) {
    console.log('inside crossrider extension ready()');
    window.foobar = 'barfoo';
    return;
});

当我刷新页面时，消息inside crossrider extension ready()被打印到控制台，所以我知道扩展已加载并正常工作，但当我尝试执行window.foobar或foobar时控制台发出一个错误，说它未定义。

这是我第一次创建扩展程序，所以我在这里缺少什么？为什么我没有在CrossRider的appAPI.ready()函数内部创建的全局变量？

Answer 1

我找不到重复的目标，所以我会解释发生了什么。

我不知道Crossrider术语，但当Chrome扩展程序在页面中执行代码时，这称为Content Script。

但是，代码不会在与页面本身相同的上下文中执行。它被称为an isolated world，除其他外，意味着window对象不会被共享。

内容脚本在称为孤立世界的特殊环境中执行。他们可以访问注入页面的DOM，但不能访问页面创建的任何JavaScript变量或函数。它将每个内容脚本视为在其运行的页面上没有执行其他JavaScript。反过来也是如此：页面上运行的JavaScript无法调用任何函数或访问内容脚本定义的任何变量。

因此，如果要设置页面可访问的变量，则需要在页面上下文中设置它。怎么样？ There are many ways，但它们都等于在页面中插入<script>元素。

var script = document.createElement('script');
script.textContent = "window.foobar = 'barfoo';";
(document.head||document.documentElement).appendChild(script);
script.parentNode.removeChild(script);

所有这些都假设您无法控制相关网页。如果这样做，还有其他方式来传达页面，因为DOM是共享的。例如，如果页面收听它，您可以raise a custom DOM event。

在CrossRider的appAPI.ready（）函数中创建的全局变量不可用于页面？

1 个答案: