228

我对 Google Chrome 扩展很感兴趣，我只想知道如何将当前选项卡的 URL 存储在变量中？

4

11 回答 11

273

像这样使用chrome.tabs.query()：

chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => {
    let url = tabs[0].url;
    // use `url` here inside the callback because it's asynchronous!
});

这要求您在扩展清单chrome.tabs中请求访问API ：

"permissions": [ ...
   "tabs"
]

请务必注意，“当前选项卡”的定义可能会因扩展程序的需要而异。

lastFocusedWindow: true当您想要访问用户焦点窗口（通常是最顶部的窗口）中的当前选项卡时，查询中的设置是合适的。

设置currentWindow: true允许您在当前执行扩展程序代码的窗口中获取当前选项卡。例如，如果您的扩展程序创建了一个新窗口/弹出窗口（更改焦点），但仍希望从运行扩展程序的窗口访问选项卡信息，这可能很有用。

我选择lastFocusedWindow: true在这个例子中使用，因为谷歌调用了currentWindow 可能并不总是存在的案例。

您可以使用此处定义的任何属性自由地进一步细化您的选项卡查询：chrome.tabs.query

于 2013-01-10T05:13:59.387 回答
84

警告！chrome.tabs.getSelected已弃用。请chrome.tabs.query按照其他答案所示使用。

首先，您必须在 manifest.json 中设置 API 的权限：

"permissions": [
    "tabs"
]

并存储 URL：

chrome.tabs.getSelected(null,function(tab) {
    var tablink = tab.url;
});
于 2009-12-30T11:31:36.723 回答
70

其他答案假设您想从弹出窗口或后台脚本中了解它。

如果您想从内容脚本中了解当前 URL ，则适用标准 JS 方式：

window.location.toString()

您可以使用 的属性window.location来访问 URL 的各个部分，例如主机、协议或路径。

于 2016-07-20T12:43:52.463 回答
27

问题是 chrome.tabs.getSelected 是异步的。下面的代码通常不会按预期工作。'tablink' 的值在写入控制台时仍然是未定义的，因为 getSelected 尚未调用重置值的回调：

var tablink;
chrome.tabs.getSelected(null,function(tab) {
    tablink = tab.url;
});
console.log(tablink);

解决方案是将代码包装在您将在函数中使用该值的位置，并由 getSelected 调用该代码。通过这种方式，您可以保证始终设置一个值，因为您的代码在执行之前必须等待提供该值。

尝试类似：

chrome.tabs.getSelected(null, function(tab) {
    myFunction(tab.url);
});

function myFunction(tablink) {
  // do stuff here
  console.log(tablink);
}
于 2010-03-30T10:35:13.690 回答
2

这是一个非常简单的方法

window.location.toString();

您可能必须这样做是内容脚本，因为它具有网页上的 js 文件可以具有的所有功能等等。

于 2021-07-29T22:17:03.093 回答
1

您好，这是一个 Google Chrome 示例，它通过电子邮件将当前站点发送给朋友。背后的基本思想是你想要的......首先它获取页面的内容（你不感兴趣）......然后它得到 URL（<-- 好的部分）

此外，它是一个很好的工作代码示例，我更喜欢阅读文档。

可以在这里找到：通过 电子邮件发送此页面

于 2009-12-30T11:58:42.240 回答
1

该解决方案已经过测试。

在 manifest.json 中为 API 设置权限

"permissions": [ ...
   "tabs",
    "activeTab",
    "<all_urls>"
]

在第一次加载调用函数时。https://developer.chrome.com/extensions/tabs#event-onActivated

chrome.tabs.onActivated.addListener((activeInfo) => {  
  sendCurrentUrl()
})

关于更改呼叫功能。https://developer.chrome.com/extensions/tabs#event-onSelectionChanged

chrome.tabs.onSelectionChanged.addListener(() => {
  sendCurrentUrl()
})

获取 URL 的函数

function sendCurrentUrl() {
  chrome.tabs.getSelected(null, function(tab) {
    var tablink = tab.url
    console.log(tablink)
  })
于 2020-06-15T06:41:21.903 回答
0

对于那些使用 的人context menu api，文档并不清楚如何获取选项卡信息。

  chrome.contextMenus.onClicked.addListener(function(info, tab) {
    console.log(info);
    return console.log(tab);
  });

https://developer.chrome.com/extensions/contextMenus

于 2014-11-16T19:38:29.000 回答
0

如果您想要存储通过 chrome 扩展程序打开或看到的 URL 的完整扩展程序：

在您的后台使用此选项：

openOptionsPage = function (hash) {
  chrome.tabs.query({ url: options_url }, function (tabs) {
    if (tabs.length > 0) {
      chrome.tabs.update(
        tabs[0].id,
        { active: true, highlighted: true, currentWindow: true },

        function (current_tab) {
          chrome.windows.update(current_tab.windowId, { focused: true });
        }
      );
    } else {
      window.addEventListener(hash, function () {
        //url hash # has changed
        console.log(" //url hash # has changed 3");
      });
      chrome.tabs.create({
        url: hash !== undefined ? options_url + "#" + hash : options_url,
      });
    }
  });
};

您还需要 index.html 文件。你可以在这个Github 中找到清单文件应该是这样的：

{
  "manifest_version": 2,
  "name": "ind count the Open Tabs in browser ",
  "version": "0.3.2",
  "description": "Show open tabs",
  "homepage_url": "https://github.com/sylouuu/chrome-open-tabs",
  "browser_action": {},
  "content_security_policy": "script-src 'self' https://ajax.googleapis.com https://www.google-analytics.com; object-src 'self'",

  "options_page": "options.html",
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content.js"]
    }
  ],
  "background": {
    "scripts": ["background.js"]
  },

  "web_accessible_resources": ["img/*.png"],

  "permissions": ["tabs", "storage"]
}

所有唯一可见的 URL 存储在浏览器控制台中描述的数组中

完整版的简单应用可以在这个 Github 上找到：

https://github.com/Farbod29/extract-and-find-the-new-tab-from-the-browser-with-chrome-extention

于 2021-11-12T23:00:31.270 回答
0

其实方法是这样的：

 chrome.tabs.onActivated.addListener(
  ({tabId}) => {
    chrome.tabs.get(tabId, function(tab){
      console.log(you are here from activated: tab.url);
    });
  },
)
于 2022-02-14T12:25:46.093 回答
-2

你必须检查一下。

HTML

<button id="saveActionId"> Save </button>

清单.json

  "permissions": [
    "activeTab",
    "tabs"
   ]

JavaScript
下面的代码会将活动窗口的所有 url 作为按钮单击的一部分保存到 JSON 对象中。

var saveActionButton = document.getElementById('saveActionId');
saveActionButton.addEventListener('click', function() {
    myArray = [];
    chrome.tabs.query({"currentWindow": true},  //{"windowId": targetWindow.id, "index": tabPosition});
    function (array_of_Tabs) {  //Tab tab
        arrayLength = array_of_Tabs.length;
        //alert(arrayLength);
        for (var i = 0; i < arrayLength; i++) {
            myArray.push(array_of_Tabs[i].url);
        }
        obj = JSON.parse(JSON.stringify(myArray));
    });
}, false);
于 2015-10-08T04:47:29.613 回答