Javascript Chrome扩展未接收runtime.onMessage侦听器

我正在做我的第一个Chrome扩展。这是一个（理论上）简单的扩展，它只做一件事：在打开选项卡时（不单击扩展图标），它应该查看页面DOM，并隐藏特定的div

从中，我决定了一种模式：

在

manifest.json

中，指向一个主后台文件（

main.js

），并将另一个文件（

content.js

）定义为

content\u脚本之一

在

main.js

中，在创建选项卡时，向

content.js

脚本发送一条消息，并传递一个回调以与页面内容一起运行

在

content.js

中，侦听消息，并在消息上隐藏页面中的div 不幸的是，第三步似乎根本没有运行（因此消息发送中的回调也没有运行）。我还没有弄清楚原因，但代码似乎没有运行。我已经仔细查看了堆栈溢出（stackoverflow）的相关内容，但还没有找到不起作用的地方

感谢您的想法/想法

以下是我当前的代码：

注意，我还没有找到一个好的调试设置。添加了，但它似乎不允许我使用

调试器或查看控制台日志，所以我现在只是发出警报。如果你在这里有建议，他们也会非常感激

manifest.json

{
  "manifest_version": 2,
  "name": "Inertia",
  "description": "My fun chrome extension!",
  "version": "1.0",
  "background": {
    "scripts": ["main.js"]
  },
  "content_scripts": [{
    "matches": ["<all_urls>"],
    "js": ["content.js"]
  }],
  "browser_action": {
    "default_icon": "icon.png"
  },
  "permissions": ["tabs"]
}

content.js

chrome.tabs.onCreated.addListener(function(tab) {
    alert('above send')
    alert(JSON.stringify(tab))
    chrome.tabs.sendMessage({ Message: 'hideCenter' }, function (doc) {
      alert('in callback')
      alert(doc)
      alert(doc.innerHTML)
      const center = doc.getElementById('center');
      if (center) {
        alert('found center');
        center.style.display = 'none';
        center.style.opacity = '0';
        alert(center)
      } else {
        alert('woops');
      }
    });
});

alert('above message listener');
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
  alert('runtime');
  alert(JSON.stringify(request))

  if (request.Message === 'hideCenter') {
    alert('message text');
    alert(document.all[0].outerHTML);
    sendResponse(document);
  } else {
    alert('different message');
    alert(request.Message)
  }
})

在所有警报中，只有两个显示出来：
上面的send
和它下面的
JSON.stringify（选项卡）
，它记录了一个JSON对象，我认为它应该这样做

知道我做错了什么吗？知道如何把这些东西正确地连接起来吗？谢谢

编辑以回应@wOxxOm的反馈：

我添加了
tab.id
作为
sendMessage
的第一个参数。我以前有过，但为了回应上的公认答案，我改变了它

无论如何，当我把它加回去的时候，打开一个新的标签就会在回调中触发警报！但是
doc
是未定义的，因此它在
doc.innerHTML
上中断。当跟随一个链接（即打开一个包含内容的新页面）时，它似乎可以工作——点击包括侦听器在内的所有警报，并成功地记录页面内容

我将继续玩这个，因为我怀疑我必须等到我当前的新标签扩展将内容添加到页面（我正试图在该扩展的基础上构建它，并更改它添加的内容），但是如果有人知道为什么新标签没有
文档
对象，请告诉我。
1。始终检查文档中的方法签名：tabs.sendMessage第一个参数应该是
tab.id
。2.3.调试（或）。只需在谷歌上搜索“如何调试chrome扩展背景页面”等
sendResponse（文档），就可以轻松找到基本内容不起作用。消息必须是JSON可编辑的。DOM节点不是JSON可验证的。您似乎正在尝试将文档发送回后台页面。那不行。您可以发送HTML，但不应该发送。在内容脚本中处理DOM，只发送回您需要的信息。@Makyen——如果我不想从页面中获取信息，而是想对DOM的（部分）做些什么，那该怎么办？这是可能的吗？如果您想操纵页面，那么必须在内容脚本中进行操作。它不能在后台脚本中发生。您可以在这两个上下文之间来回传递信息，但这些信息必须是JSON可编辑的。