从 Chrome 扩展程序的页面操作弹出窗口与活动选项卡上的内容脚本通信

Question

我不知道如何在内容脚本和页面操作弹出窗口之间传递数据。

我从以下简单的框架开始，它显示了标题中带有减号的任何页面的页面操作：

• 扩展清单 (manifest.json)：

  {
     …
     "permissions": ["http://example.org/*"],
     "background": {"scripts": ["background.js"]},
     "page_action": {"default_popup": "popup.html", …},
     "content_scripts": {
       "matches": ["http://example.org/*"],
       "js": ["content.js"]
     }
  }
  

• 后台脚本（background.js）：

  chrome.extension.onRequest.addListener(function (msg, sender, respond) {
    if (msg && msg.what === "match") {
      console.log("Match:", msg.title);
      chrome.pageAction.show(sender.tab.id);
    }
  }
  

• 内容脚本 (content.js)，检查文档标题：

  var title = document.title;
  if (title.indexOf("-") >= 0) {
    chrome.extension.sendRequest({"what": "match", "title": title});
  }
  

现在，在页面操作的弹出窗口中，我想显示匹配页面的标题。不是最后加载页面的标题（如使用 this answer 所做的那样），而是活动选项卡的标题。

虽然我的第一个查询是向内容脚本发送查询，但根据文档 chrome.extension.sendMessage 会将其发送给 所有 侦听器（即所有选项卡上的所有内容脚本），没有任何明确定义我将收到谁的回复。另外，我不能使用chrome.tabs.sendMessage，因为它需要 tabId。尝试使用chrome.tabs.getCurrent 查找当前选项卡将返回null，因为查询来自非选项卡上下文（来自弹出窗口）。

我想我可能可以使用chrome.tabs.executeScript 进行交流，但这感觉很脏。

不过，我相信这是一件基本的事情，应该很容易做到，但我只是错过了一些东西。有人可以帮我吗，最好是示例代码？

更新：我找到了Mappy example extension，它使用chrome.tabs.onUpdated 来跟踪活动标签。不幸的是，这需要tabs 许可。就个人而言，我希望尽可能使用最少的权限。

那么，不幸的是权限系统设计不好，我别无选择，只能这样做，还是有任何解决方法？如果chrome.pageAction.onClicked 事件处理程序（提供我需要的Tab 对象）允许我显示一个弹出窗口，我会很高兴...

Answer 1

我认为您需要在弹出窗口中添加 onClick 事件侦听器：

chrome.pageAction.onClicked.addListener(function(tabs.Tab tab) {...});

请参阅文档here。

事件侦听器的回调将为您提供肯定是活动选项卡的 tabId。

Answer 2

您的代码中有多个问题

• chrome.extension.sendRequest({"what": "match", "title": title}); 中的 chrome.extension.sendRequest 已弃用
• 当您的清单中有 "page_action": {"default_popup": "popup.html", …}, 时，chrome.pageAction.onClicked 不会触发。
• chrome.extension.sendMessage will send it to all listeners (i.e. all my content scripts on all tabs), 是一个无效的假设，它将发送到扩展页面。

我多次尝试阅读您的问题，但无法理解您想要实现的目标，您能解释一下吗？