Chrome扩展程序:从弹出窗口获取当前标签

Question

我正在编写Chrome扩展程序,在其中的一部分中,我需要在单击弹出页面上的按钮时获取当前选项卡的标题和URL.

我以前曾经使用过Chrome的消息传递系统,并且经过多方努力,很多时候都设法让它运行起来.但是,我从来没有必要在弹出页面上使用它们,而且从我读过的内容来看,这样做要困难得多.

到目前为止,我设法弄清楚的时间表是这样的:

1. popup.html/ popup.js:单击按钮
2. popup.html/ popup.js:请求/消息被发送到内容脚本
3. contentScript.js:从弹出页面接收请求/消息
4. contentScript.js:当前选项卡的标题和URL存储在变量中
5. contentScript.js:2个变量作为字符串化响应发送
6. popup.html/ popup.js:从响应中解析出2个变量

通常我会想到这一点,但是,我已经阅读了一些在工作中抛出扳手的东西,例如:

• chrome.tabs.getSelected只能在后台页面/脚本中使用.这是否意味着根本不需要使用内容脚本？
• 消息无法直接从内容脚本发送到弹出页面,它们必须通过后台页面进行
• 必须先将弹出窗口确认为已存在,然后才能将消息传递给它(尽管如此,我想我知道如何执行此操作)

我已经发现Chrome的消息传递系统很难,但这让我很困惑.因此,这篇文章.

Answer 1

chrome.tabs.getSelected已弃用.你应该使用chrome.tabs.query.

chrome.tabs.query 需要两个参数:查询对象和回调函数,它将结果选项卡数组作为参数.

您可以通过查询当前处于活动状态且位于当前窗口中的所有选项卡来获取"当前选项卡".

var query = { active: true, currentWindow: true };

由于查询将返回仅包含当前选项卡的Tab数组,因此请务必获取回调中的第一个元素

function callback(tabs) {
  var currentTab = tabs[0]; // there will be only one in this array
  console.log(currentTab); // also has properties like currentTab.id
}

Etvoilà:

chrome.tabs.query(query, callback);