从 Chrome 扩展的内容脚本中获取“ this”选项卡 ID?

从内容脚本中,是否可以访问该选项卡的 id

我想从内容脚本发送一条消息到后台页面,告诉我的扩展名使用 chrome.tabs.* API“使用这个选项卡做一些事情”。

需要一个 tabID,如果我的内容脚本可以简单地告诉它消息内容中的 tabID,那么在后台页面中执行大量逻辑来寻找 tabID就没有意义了。

38446 次浏览

消息发送者对象中自动传递 Tab id:

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

注意: 根据 医生,这个属性并不总是可用的:

当从选项卡(包括内容脚本)打开连接时,只有当接收方是扩展而不是应用程序时,才会出现此属性 只有

如果使用 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);
});
}
});

如果你想自己的 tabId(在我的案例中是内容脚本)不需要“ tabs”权限,一个解决方案是让内容脚本发送一个虚拟消息到后台脚本,然后让后台脚本响应 sender.tab.id回到内容脚本!

例如 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});
}
});

这是一个愚蠢的变通方法,对我很有效。 :)

哦,如果你有 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);
});
});

更正当今选定的答案:

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

如果以编程方式注入内容脚本, 另一种方法是将 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.The 变量访问它 不会因为内容脚本而暴露给页面脚本 生活在一个与世隔绝的世界。