Chrome 扩展共享脚本变量答案

【问题标题】：Chrome Extrensions Share Script variablesChrome 扩展共享脚本变量
【发布时间】：2018-08-26 10:47:31
【问题描述】：

我正在开发具有 2 个脚本文件的 chrome 扩展程序。一个作为content_scripts（页面脚本）附加到manifest.json。而且我还有一个脚本文件附加到我的插件popup.html 文件（插件脚本）。

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

我可以在两个脚本之间进行通信吗？因为如果我尝试将所有内容合二为一，则它无法访问对面页面的元素。

【问题讨论】：

标签： javascript html google-chrome-extension google-chrome-devtools manifest.json

【解决方案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);
}

【讨论】：

这个方法对我不起作用。为什么要检查选项卡和窗口？有关系吗？我只需要在两个脚本中都可以访问我的变量
内容脚本和 popup.html 脚本都在不同的上下文中工作，因此两者都无法访问彼此的变量。唯一的方法是使用消息传递彼此通信。检查选项卡和窗口将确保在当前活动选项卡中进行通信。希望现在清楚了。