Como posso obter o URL da guia atual de uma extensão do Google Chrome?

Estou me divertindo com a extensão do Google Chrome e só quero saber como posso armazenar o URL da guia atual em uma variável?

Use chrome.tabs.query()assim:

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

Isso requer que você solicite acesso à chrome.tabsAPI no manifesto de extensão :

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

É importante observar que a definição da sua "guia atual" pode diferir dependendo das necessidades da sua extensão.

A configuração lastFocusedWindow: truena consulta é apropriada quando você deseja acessar a guia atual na janela focada do usuário (normalmente a janela superior).

A configuração currentWindow: truepermite que você obtenha a guia atual na janela em que o código da sua extensão está atualmente em execução. Por exemplo, isso pode ser útil se sua extensão cria uma nova janela / pop-up (mudança de foco), mas ainda deseja acessar as informações da guia na janela em que a extensão foi executada.

Eu escolhi usar lastFocusedWindow: trueneste exemplo, porque o Google chama casos em que currentWindow nem sempre podem estar presentes .

Você pode refinar ainda mais a consulta da guia usando qualquer uma das propriedades definidas aqui: chrome.tabs.query

Aviso! chrome.tabs.getSelectedestá obsoleto . Por favor, use chrome.tabs.querycomo mostrado nas outras respostas.

Primeiro, você deve definir as permissões para a API no manifest.json:

"permissions": [
    "tabs"
]

E para armazenar a URL:

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

Outras respostas assumem que você deseja conhecê-lo em um script pop-up ou em segundo plano.

Caso você queira saber a URL atual de um script de conteúdo , a maneira JS padrão se aplica:

window.location.toString()

Você pode usar propriedades de window.locationpara acessar partes individuais da URL, como host, protocolo ou caminho.

O problema é que chrome.tabs.getSelected é assíncrono. Este código abaixo geralmente não funcionará conforme o esperado. O valor de 'tablink' ainda será indefinido quando for gravado no console porque getSelected ainda não invocou o retorno de chamada que redefine o valor:

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

A solução é agrupar o código no qual você usará o valor em uma função e chamará o getSelected. Dessa forma, você sempre terá um valor definido, pois seu código terá que aguardar o valor ser fornecido antes de ser executado.

Tente algo como:

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

function myFunction(tablink) {
  // do stuff here
  console.log(tablink);
}

Olá, aqui está um exemplo do Google Chrome que envia por e-mail o site atual a um amigo. A idéia básica por trás é o que você deseja ... antes de tudo, busca o conteúdo da página (não é interessante para você) ... depois obtém o URL (<- boa parte)

Além disso, é um bom exemplo de código de trabalho, que eu prefiro mais do que ler documentos.

Pode ser encontrado aqui: Enviar por e-mail

Esta solução já foi testada.

definir permissões para a API no manifest.json

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

Na primeira função de chamada de carregamento. https://developer.chrome.com/extensions/tabs#event-onActivated

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

Na função de mudança de chamada. https://developer.chrome.com/extensions/tabs#event-onSelectionChanged

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

a função para obter o URL

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

Para aqueles que usam o context menu api, os documentos não são claros imediatamente sobre como obter informações da guia.

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

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

Você tem que verificar isso .

HTML

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

manifest.json

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

JavaScript
O código abaixo salvará todos os URLs da janela ativa no objeto JSON como parte do clique do botão.

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);