尝试在chrome扩展(JavaScript)中从default_script到content_script进行通信无法正常工作

好吧,所以我通过扩展程序更改网站的配色方案,这是我第一次使用content_scripts所以是的,我是一个完整的新手,随意把我当作一个人.

问题是tabs.connect它不工作,我需要标签ID或什么？这是我到目前为止所拥有的:

manifest.json的:

{
  "manifest_version": 2,

  "name": "ROBLOX Color Scheme",
  "description": "Edit the color scheme of the roblox bar! Note: Not created by roblox.",
  "version": "1.0",

  "permissions": [
    "",
    "tabs"
  ],
  "browser_action": {
    "default_icon": "Icon.png",
    "default_popup": "Popup.html"
  },
  "content_scripts": [
    {
      "matches": ["http://www.roblox.com/*"],
      "js": ["ContentScript.js"]
    }
  ]
}

Popup.html:

    
        
Choose a color:
        
        Change Color!
    
    
        
    

的script.js:

function ChangeColor() {
  var TabId;
    chrome.tabs.query({currentWindow: true, active: true}, function(tabArray) {
      TabId = tabArray[0];
    });
  var port = chrome.tabs.connect(TabId, {name: "ColorShare"});
  port.postMessage({Color: document.getElementById("Color").value});
}

document.getElementById('Color').addEventListener("click", ChangeColor);

ContentScript.js:

var Color;
chrome.runtime.onConnect.addListener(function(port) {
  if (port.name == "ColorShare") then {
    port.onMessage.addListener(function(msg) {
      Color = msg.Color;
    });
  }
});

document.getElementsByClassName("header-2014 clearfix")[0].style.backgroundColor = Color;

所有的帮助表示赞赏,感谢您花时间回答我的问题!

编辑:有些文件已经改变了,感谢我自己和一个回答的人的帮助,这些现在没有产生任何错误,但没有任何改变,任何你可能提供的帮助都会很棒!以下是当前的代码:

的script.js:

chrome.tabs.query({currentWindow: true, active: true}, function(tabArray) {
    var TabId = tabArray[0].id;
    var port = chrome.tabs.connect(TabId, {name: "ColorShare"});

    function ChangeColor() {
        port.postMessage({Color: document.getElementById("Color").value});
    }
    document.getElementById('Color').addEventListener("click", ChangeColor);
});

ContentScript.js:

chrome.runtime.onConnect.addListener(function(port) {
    if (port.name == "ColorShare") {
        port.onMessage.addListener(function(msg) {
            document.querySelector("header-2014 clearfix").style.backgroundColor = msg.Color;
        });
    }
});

编辑:这个问题解决了.我不得不使用chrome.storage.sync.set和chrome.storage.sync.get,它完全支持内容脚本!我将发布很快使用的脚本!