web-dev-qa-db-fra.com

Chrome: obtenir l'onglet actuel à partir de la fenêtre contextuelle

J'écris une extension Chrome et, dans une partie de celle-ci, j'ai besoin d'obtenir le titre et l'URL de l'onglet actuel lorsqu'un bouton de la page contextuelle est cliqué.

J'ai travaillé avec le système de transmission de messages de Chrome avant et, après beaucoup d'efforts, j'ai réussi à le faire fonctionner, à de nombreuses reprises. Cependant, je n'ai jamais eu à les utiliser avec des pages popup et, d'après ce que j'ai lu, c'est beaucoup plus difficile à faire.

La chronologie que j'ai réussi à comprendre jusqu'à présent est la suivante:

  1. popup.html/popup.js: Le bouton est cliqué
  2. popup.html/popup.js: La demande/le message est envoyé au script de contenu
  3. contentScript.js: La demande/le message est reçu de la page popup
  4. contentScript.js: Le titre et l'URL de l'onglet actuel sont stockés dans une variable
  5. contentScript.js: Les 2 variables sont envoyées sous forme de réponse chaîne
  6. popup.html/popup.js: Les 2 variables sont analysées à partir de la réponse

Habituellement, je serais en mesure de comprendre cela, mais j'ai lu quelques éléments qui ont jeté une clé dans les travaux, tels que:

  • chrome.tabs.getSelected ne peut être utilisé que dans une page/un script d'arrière-plan. Est-ce à dire que les scripts de contenu n'ont pas du tout besoin d'être utilisés?
  • Les messages ne peuvent pas être envoyés directement du script de contenu à la page popup, ils doivent passer par une page d'arrière-plan
  • Une fenêtre contextuelle doit être confirmée comme existante avant qu'un message puisse lui être transmis (bien que, je pense que je sais comment faire)

J'ai déjà trouvé le système de transmission des messages de Chrome assez difficile, mais cela m'a totalement dérouté. Par conséquent, ce poste.

javascriptgoogle-chromemessage
33
mythofechelon

chrome.tabs.getSelected est obsolète. Tu devrais utiliser chrome.tabs.query à la place.

chrome.tabs.query nécessite deux paramètres: un objet de requête et une fonction de rappel qui prend le tableau des onglets résultants comme paramètre.

Vous pouvez obtenir l '"onglet actuel" en interrogeant tous les onglets actuellement actifs et se trouvant dans la fenêtre actuelle.

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

Étant donné que la requête retournera un tableau Tab contenant uniquement l'onglet actuel, assurez-vous de prendre le premier élément du rappel

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

Et voilà:

chrome.tabs.query(query, callback);
69
fny