Question

从内容脚本中，是否可以访问该标签的ID？我想从内容脚本向后台页面发送一条消息，告诉我的扩展程序使用chrome.tabs。* api“使用此选项卡执行某些操作”。需要一个TabID，当我的内容脚本只是告诉它消息内容中的TabID时，在后台页面中做一堆逻辑以寻找一个TabID没有意义。

Answer 1

标签ID会自动在MessageSender对象内传递：

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log("sent from tab.id=", sender.tab.id);
});

Answer 2

如果您使用Ports进行双向长期连接，则回调中的第二个参数是Port对象，因此要访问选项卡ID：

chrome.runtime.onConnect.addListener(port => {
  if (port.name === "foo") {
    port.onMessage.addListener((msg, sendingPort) => {
      console.log("sent from tab.id=", sendingPort.sender.tab.id);
    });
  }
});

Answer 3

如果您想要自己的tabId（在我的情况下在内容脚本中）而不需要“tabs”权限，则解决方法是让内容脚本向后台脚本发送虚拟消息，然后让后台脚本以sender.tab.id回复内容脚本！

e.g。在content.js：

chrome.runtime.sendMessage({ text: "what is my tab_id?" }, tabId => {
   console.log('My tabId is', tabId);
});

和background.js：

chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
    if (msg.text == "what is my tab_id?") {
        sendResponse({tab: sender.tab.id});
    }
});

这是一个对我有用的愚蠢的解决方法。：）

PS。哦，如果您拥有tabs权限，那么您可以非常轻松地运行此异步查询：

chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
    var myTabId = tabs[0].id;
    chrome.tabs.sendMessage(myTabId, {text: "hi"}, function(response) {
        alert(response);
    });
});

Answer 4

如果以编程方式注入了内容脚本，另一种方法是将tabId存储在全局变量中：

const injectTabId = (callback) => chrome.tabs.executeScript(
  tabId,
  {code: `window.tabId = ${tabId}`},
  callback
);

const injectFile = () => chrome.tabs.executeScript(
  tabId,
  {file: 'content.js'}
);

injectTabId(injectFile);

在内容脚本中，使用window.tabId访问它。变量不会因内容脚本而暴露于页面脚本生活在一个孤立的世界中。

Answer 5

当今所选答案的更正：

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log("sent from tab.id=", sender.id);
});

从Chrome扩展程序中的内容脚本中获取“此”标签ID？

5 个答案: