我正在为 Chrome 开发一个扩展程序。我希望解析“原始”Gmail 邮件（当前查看的邮件）的内容。
我尝试使用 jQuery.load() 如下
$(windows).load(function() { alert(GLOBALS); });
并将其放在内容脚本中，但它也不起作用。我正在使用 Chrome 的开发人员工具，它在调用alert(GLOBALS);
未捕获的 ReferenceError：未定义 GLOBALS
尽管在使用开发人员工具的控制台时，在控制台中键入GLOBALS它会返回一个数组。
任何线索如何从内容脚本访问 GLOBALS？
内容脚本在隔离环境中运行。要访问任何全局属性（页面的window），您必须注入一个新<script>元素，或使用事件侦听器来传递数据。
例如，请参阅有关在页面上下文中注入元素的答案<script>。
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 - 位于扩展目录中，这将被注入到页面本身：
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);
由于此文件是通过 DOM 中的 chrome-extension: URL 加载的，因此必须将“script.js”添加到清单文件的 web_accessible_resources 部分。否则 Chrome 将拒绝加载脚本文件。
您应该在网页中运行尽可能少的逻辑，并在内容脚本中处理大部分逻辑。这有多种原因。首先，注入到页面中的任何脚本都在与网页相同的上下文中运行，因此网页可以（有意或无意）修改 JavaScript/DOM 方法，使您的扩展程序停止工作。其次，内容脚本可以访问额外的功能，例如 chrome.* API 和跨域网络请求的有限子集（前提是扩展程序已声明这些权限）。
在 chrome 扩展 content_script 和页面上的 javascript 之间进行通信的一个更现代的解决方案是使用 html5 postMessage API。发送到“window”的任何消息都可以从网页上的 javascript 和扩展程序的 content_script 中看到。
扩展的 content_script.js：
window.addEventListener('message', function(event) {
console.log('content_script.js got message:', event);
// check event.type and event.data
});
setTimeout(function () {
console.log('cs sending message');
window.postMessage({ type: 'content_script_type',
text: 'Hello from content_script.js!'},
'*' /* targetOrigin: any */ );
}, 1000);
网页上运行的javascript：
window.addEventListener('message', function(event) {
console.log('page javascript got message:', event);
});
setTimeout(function() {
console.log('page javascript sending message');
window.postMessage({ type: 'page_js_type',
text: "Hello from the page's javascript!"},
'*' /* targetOrigin: any */);
}, 2000);
另请参阅http://developer.chrome.com/extensions/content_scripts.html#host-page-communication
有一个新的网页 API 可以安全地与内容脚本进行通信，并且没有任何副作用（window.postMessage 可以有其他侦听器！）。
“从网页中，使用 runtime.sendMessage 或 runtime.connect API 向特定应用程序或扩展程序发送消息”
// The ID of the extension we want to talk to.
var editorExtensionId = "abcdefghijklmnoabcdefhijklmnoabc";
// Make a simple request:
chrome.runtime.sendMessage(editorExtensionId, {openUrlInEditor: url},
function(response) {
if (!response.success)
handleError(url);
});
“从您的应用程序或扩展程序中，您可以通过 runtime.onMessageExternal 或 runtime.onConnectExternal API 收听来自网页的消息，类似于跨扩展程序消息传递。只有网页才能发起连接。[...]”
（来自http://developer.chrome.com/extensions/messaging.html）这仍然只在 chrome 的开发频道中可用，但似乎它会在下一个版本左右。
不要问我这是如何工作的，这似乎非常令人困惑。chrome.runtime 到底是如何在网页上定义的？如果脚本由于某种原因已经定义了该变量怎么办？我也找不到铬错误报告来查看此功能的开发历史。
根据您的扩展程序的可访问 html 页面，我有一个稍微不同的方法。
将您的页面添加到清单：
"web_accessible_resources": ["variables.html"]创建您的页面（此处为 variables.html）并提取内容数据（即 window.contentVar）：
<script type="text/javascript">
$("#my-var-name").text(window["contentVar"]);
</script>
<div id="my-var-name" style="display: none;"></div>从扩展程序的 JavaScript 访问：
var myVarName = $("#my-var-name").text();添加到您的内容脚本：
function executeOnPageSpace(code){
// create a script tag
var script = document.createElement('script')
script.id = 'tmpScript'
// place the code inside the script. later replace it with execution result.
script.textContent =
'document.getElementById("tmpScript").textContent = JSON.stringify(' + code + ')'
// attach the script to page
document.documentElement.appendChild(script)
// collect execution results
let result = document.getElementById("tmpScript").textContent
// remove script from page
script.remove()
return JSON.parse(result)
}
现在你可以这样做：
let window = executeOnPageSpace('window')
甚至像这样：
executeOnPageSpace('window.location.href = "http://stackoverflow.com"')
注意：我还没有对长时间运行的代码进行测试。