¿Cómo puedo obtener la URL de la pestaña actual de una extensión de Google Chrome?

Me estoy divirtiendo con la extensión Google Chrome, y solo quiero saber cómo puedo almacenar la URL de la pestaña actual en una variable.

Usar chrome.tabs.query()así:

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

Esto requiere que solicite acceso a la chrome.tabsAPI en su manifiesto de extensión :

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

Es importante tener en cuenta que la definición de su "pestaña actual" puede variar según las necesidades de su extensión.

La configuración lastFocusedWindow: trueen la consulta es apropiada cuando desea acceder a la pestaña actual en la ventana enfocada del usuario (generalmente la ventana superior).

La configuración le currentWindow: truepermite obtener la pestaña actual en la ventana donde el código de su extensión se está ejecutando actualmente. Por ejemplo, esto podría ser útil si su extensión crea una nueva ventana / ventana emergente (cambio de enfoque), pero aún quiere acceder a la información de la pestaña desde la ventana donde se ejecutó la extensión.

Elegí usar lastFocusedWindow: trueen este ejemplo, porque Google menciona casos en los que currentWindow no siempre están presentes .

Puede refinar aún más su consulta de pestañas utilizando cualquiera de las propiedades definidas aquí: chrome.tabs.query

¡Advertencia! chrome.tabs.getSelectedestá en desuso . Utilice chrome.tabs.querycomo se muestra en las otras respuestas.

Primero, debe establecer los permisos para la API en manifest.json:

"permissions": [
    "tabs"
]

Y para almacenar la URL:

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

Otras respuestas suponen que desea saberlo desde una ventana emergente o un script de fondo.

En caso de que desee conocer la URL actual de un script de contenido , se aplica la forma estándar de JS:

window.location.toString()

Puede usar las propiedades de window.locationpara acceder a partes individuales de la URL, como el host, el protocolo o la ruta.

El problema es que chrome.tabs.getSelected es asíncrono. Este código a continuación generalmente no funcionará como se esperaba. El valor de 'tablink' seguirá sin definirse cuando se escriba en la consola porque getSelected aún no ha invocado la devolución de llamada que restablece el valor:

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

La solución es envolver el código donde usará el valor en una función y hacer que se invoca getSelected. De esta manera, se garantiza que siempre tendrá un valor establecido, ya que su código tendrá que esperar a que se proporcione el valor antes de ejecutarse.

Intenta algo como:

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

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

Hola, aquí hay una muestra de Google Chrome que envía por correo electrónico el sitio actual a un amigo. La idea básica detrás es lo que quieres ... en primer lugar, busca el contenido de la página (no es interesante para ti) ... luego obtiene la URL (<- buena parte)

Además, es un buen ejemplo de código de trabajo, que prefiero con mucho entusiasmo a leer Documentos.

Se puede encontrar aquí: envíe esta página por correo electrónico

Esta solución ya está PROBADA.

establecer permisos para API en manifest.json

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

En la primera carga llama a la función. https://developer.chrome.com/extensions/tabs#event-onActivated

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

En función de cambio de llamada. https://developer.chrome.com/extensions/tabs#event-onSelectionChanged

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

la función para obtener la URL

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

Para aquellos que usan el context menu api, los documentos no tienen claro de inmediato cómo obtener información de la pestaña.

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

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

Tienes que verificar esto .

HTML

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

manifest.json

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

JavaScript
El siguiente código guardará todas las URL de la ventana activa en el objeto JSON como parte del clic del botón.

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