Chrome Extrensions共享脚本变量

时间:2018-03-17 13:20:22

标签: javascript html5 google-chrome-extension google-chrome-devtools manifest.json

我正在开发一个包含2个脚本文件的chrome扩展程序。一个附加到manifest.json作为content_scripts(页面脚本)。我还有一个脚本文件附加到我的附加popup.html文件(附加脚本)。

当我在我的页面脚本中声明var时,我尝试在我的附加脚本中调用它,然后我得到undeclared varible

我可以在两个脚本之间进行通信吗? 因为如果我尝试在一个中完成所有操作,那么它就无法访问相反页面的元素。

1 个答案:

答案 0 :(得分:1)

您可以使用messaging轻松地将值从背景传递到内容脚本。

下面是一个简单的例子:

  

的manifest.json

{
  "name": "test",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "Test ",
  "background": {
    "scripts": [
      "background.js"
    ]
  },
  "browser_action": {
    "default_title": "Test "
  },
  "permissions": [
    "*://*/*",
    "tabs"
  ], "content_scripts" : [{
            "matches" :  ["*://*/*"],
            "js" : ["content.js"]
        }]
}
  

background.js

  chrome.browserAction.onClicked.addListener(function(){
       chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
            chrome.tabs.sendMessage(tabs[0].id, {data: "some value"});
        });
    });
  

content.js

chrome.extension.onMessage.addListener(handleMessage);
function handleMessage(request) {
    console.log(request.data);
}