Chrome扩展程序：即使在控制台中存在Chrome扩展中的变量undefined [英] Chrome extensions: variable undefined in chrome extension even though it exists in console

问题描述

在我的Chrome扩展的内容脚本中，一旦完成加载，我就会动态地将一个外部js文件加载到html页面中。我加载的这个js文件将定义一个名为 rfk 的变量。当定义 rfk 时，我有一个设置的Interval，它会执行一个脚本。但是，即使在成功加载页面后，我的内容脚本也不会找到 rfk 来定义，即使我可以通过浏览器控制台检查并找到



 content_scripts：[
 {
> rfk 匹配：[*：//www.att.com/*]，
js：[att.js]，
run_at：document_end
 } 
 
 
 
 $ b这是我的att.js文件中的代码片段：
  alert（'hey！'）; 
 
 document.body.style.backgroundColor =red; 
 
 var url =// product.reflektion.com/rfk/js/11165-52846072/init.js?cv=test&q=\"+(new Date）.getTime（）
，o = document，s = o.createElement（script）; 
 
 s.type =text / javascript; 
 s.src = url; 
 o.getElementsByTagName（head）[0] .appendChild（s）; 
 
 var cE = setInterval（function（）{
 rfk&&（demo =instagram，rfk.P.fs.rw.extra_args = {drsp：{_ v：demo }}，rfk.rebuild（），clearInterval（cE））
}，100）; 
  
 
 
解决方案
 独立世界的问题。 
 
 
 
 
内容脚本在称为孤立的世界的特殊环境中执行。他们可以访问他们注入的页面的DOM，但不能访问页面创建的任何JavaScript变量或函数。它会查看每个内容脚本，就好像其上运行的页面上没有执行其他JavaScript一样。反过来也是如此：页面上运行的JavaScript不能调用任何函数或访问由内容脚本定义的任何变量。
 
 
您的内容脚本永远不会看到页面定义的变量。在控制台中，您（默认情况下）查看页面的上下文，而不是内容脚本的上下文。您可以将其切换（在< top frame> 下拉列表中）进行测试。  您需要 a>对页面自己的JS做任何事情。
 
In my content scripts for my chrome extension, I dynamically load a external js file onto a html page once it is finished loading. This js file I load will define a variable called rfk. I have a set Interval for when rfk is defined, it will execute a script. However, even after succesfully loading the page, my content script will never find rfk to be defined, even though I can check through the browser console and find that rfk exists.
"content_scripts": [
    {
        "matches": ["*://www.att.com/*"],
        "js": ["att.js"],
        "run_at":"document_end"
    }
]
This is my code snippet in my att.js file:
alert('hey!');

document.body.style.backgroundColor="red";

var url="//product.reflektion.com/rfk/js/11165-52846072/init.js?cv=test&q="+(new Date).getTime()
, o = document, s = o.createElement("script");

s.type="text/javascript";
s.src=url;
o.getElementsByTagName("head")[0].appendChild(s);

var cE = setInterval(function(){
    rfk && (demo="instagram",rfk.P.fs.rw.extra_args={drsp:{_v:demo}},rfk.rebuild(),clearInterval(cE))
},100);

解决方案
Isolated world problem.

  
Content scripts execute in a special environment called an isolated world. They have access to the DOM of the page they are injected into, but not to any JavaScript variables or functions created by the page. It looks to each content script as if there is no other JavaScript executing on the page it is running on. The same is true in reverse: JavaScript running on the page cannot call any functions or access any variables defined by content scripts.
Your content script will never see the variables defined by the page. And in the console you're (by default) looking at the page's context, not content script's context. You can switch that (in the <top frame> dropdown) to test.

You need to inject a page-level script to do anything with the page's own JS.

                        
这篇关于Chrome扩展程序：即使在控制台中存在Chrome扩展中的变量undefined的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！