Chrome 扩展程序 - 从网页中检索全局变量 [英] Chrome extension - retrieving global variable from webpage
问题描述
我正在开发 Chrome 扩展程序.我希望解析原始"Gmail 邮件(当前查看的邮件)的内容.
I am working on an extension for Chrome. I wish parse the content of the "original" Gmail message (the currently viewed message).
我尝试使用 jQuery.load() 如下
I tried to utilize the jQuery.load() as follows
$(windows).load(function() { alert(GLOBALS); });
并将其放置在内容脚本中,但它也不起作用.我正在使用 Chrome 的开发人员工具,它在调用 alert(GLOBALS);
and place it at the content script, but it does not work either. I am using Chrome's developer tools, which returns the following error on the invocation of the alert(GLOBALS);
未捕获的引用错误:未定义 GLOBALS
Uncaught ReferenceError: GLOBALS is not defined
虽然,当使用开发者工具的控制台时,在控制台中输入GLOBALS
会返回一个数组.
Although, when using the developers tools' console, typing into the console GLOBALS
it returns an array.
知道如何从内容脚本访问 GLOBALS 吗?
Any clue how to access the GLOBALS from the content script?
推荐答案
内容脚本一个孤立的环境.要访问任何全局属性(页面的 window
),您必须注入一个新的 元素,或者使用事件侦听器来传递数据.
Content scripts run in an isolated environment. To get access to the any global properties (of the page's window
), you have to either inject a new <script>
element, or use event listeners for passing data.
参见这个答案,例如注入 页面上下文中的元素.
See this answer for example on injecting a <script>
element in the context of the page.
contentscript.js(清单中的run_at":document_end"
):
var s = document.createElement('script');
s.src = chrome.extension.getURL('script.js');
(document.head||document.documentElement).appendChild(s);
s.onload = function() {
s.remove();
};
// Event listener
document.addEventListener('RW759_connectExtension', function(e) {
// e.detail contains the transferred data (can be anything, ranging
// from JavaScript objects to strings).
// Do something, for example:
alert(e.detail);
});
script.js
- 位于扩展目录中,这将被注入到页面本身:
script.js
- Located in the extension directory, this will be injected into the page itself:
setTimeout(function() {
/* Example: Send data from the page to your Chrome extension */
document.dispatchEvent(new CustomEvent('RW759_connectExtension', {
detail: GLOBALS // Some variable from Gmail.
}));
}, 0);
由于该文件是通过 chrome-extension: 来自 DOM 中的 URL 加载的,因此script.js"必须添加到清单文件的 web_accessible_resources 部分.否则 Chrome 将拒绝加载脚本文件.
Since this file is being loaded via a chrome-extension: URL from within the DOM, "script.js" must be added to the web_accessible_resources section of the manifest file. Otherwise Chrome will refuse to load the script file.
您应该在网页中运行尽可能少的逻辑,并在内容脚本中处理大部分逻辑.这有多种原因.首先,注入到页面中的任何脚本都在与网页相同的上下文中运行,因此网页可以(有意或无意)修改 JavaScript/DOM 方法,使您的扩展程序停止工作.其次,内容脚本可以访问额外的功能,例如 chrome.* API 和跨域网络请求的有限子集(前提是扩展程序已声明这些权限).
You should run as little logic as possible in the web page, and handle most of your logic in the content script. This has multiple reasons. First and foremost, any script injected in the page runs in the same context as the web page, so the web page can (deliberately or inadvertently) modify JavaScript/DOM methods in such a way that your extension stops working. Secondly, content script have access to extra features, such a limited subset of the chrome.* APIs and cross-origin network requests (provided that the extension has declared permissions for those).
这篇关于Chrome 扩展程序 - 从网页中检索全局变量的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!