从内容脚本中注入js脚本读取变量和函数

Question

我从内容脚本中注入一个脚本，如

内容-的script.js

var s = document.createElement('script');
// TODO: add "script.js" to web_accessible_resources in manifest.json
s.src = chrome.extension.getURL('latest.js');
s.onload = function(){
   console.log(test);
}
(document.body || document.documentElement).appendChild(s);

latest.js

var test = 1000;

它添加得当，但现在我的问题是从内容脚本上的latest.js读取变量和函数，因为内容脚本有一些数据需要通过使用其函数或变量传入latest.js。

所以，onload函数我尝试在latest.js中定义的console.log（test）但我不能使用它，它是未定义的。

帮助我!!!

Answer 1

根据Chrome扩展程序docs about a content scripts：

  

...内容脚本有一些限制。他们不能：   使用其扩展页面定义的变量或函数   使用由网页或其他内容脚本定义的变量或函数

因此，您的latest.js弹出到限制区域，而内容脚本无法直接读取该数据。

但文档还提供了一个解决方案：通过.postMessage进行通信。

Example from the docs：

内容脚本

var port = chrome.runtime.connect();

window.addEventListener("message", function(event) {
  // We only accept messages from ourselves
  if (event.source != window)
    return;

  if (event.data.type && (event.data.type == "FROM_PAGE")) {
    console.log("Content script received: " + event.data.text);
    port.postMessage(event.data.text);
  }
}, false);

注入脚本（在您的情况下为latest.js）

document.getElementById("theButton").addEventListener("click",
    function() {
  window.postMessage({ type: "FROM_PAGE", text: "Hello from the webpage!" }, "*");
}, false);