web-dev-qa-db-fra.com

Comment modifier l'emplacement actuel de l'URL dans chrome via les extensions

Je veux créer une extension qui redirige l'utilisateur vers un autre site Web s'il clique sur le bouton d'extension. Jusqu'à présent, je n'ai vu que des extensions qui créent un nouvel onglet pour chaque clic.

Est-il possible de rediriger l'utilisateur vers un autre site Web en utilisant l'onglet actif?

J'ai essayé quelque chose comme ça:

chrome.browserAction.onClicked.addListener(function(tab) {
    var url = "https://www.mipanga.com/Content/Submit?url="
        + encodeURIComponent(tab.url)
        + "&title=" + encodeURIComponent(tab.title);

    document.location.href = url; // <-- this does not work
});
javascriptgoogle-chromegoogle-chrome-extension
42
user230054

Attention: Si vous développez des extensions multi-navigateurs (j'espère que oui!), Je vous recommande d'utiliser chrome.tabs.query() . Veuillez consulter réponse de Jean-Marc Amon pour plus d'informations. Cette réponse fonctionne toujours dans Firefox et Chrome, mais query() est plus couramment utilisé, a plus d'options et fonctionne dans les pages d'arrière-plan et les vues contextuelles.

À partir de l'API chrome.tabs , vous pouvez utiliser getCurrent() ou query() .

Je préfère getCurrent mais il ne peut pas être appelé à partir d'un contexte sans onglet (par exemple une page d'arrière-plan ou une vue contextuelle). Si cela vous pose problème, vous devriez plutôt utiliser query. réponse ci-dessous de Jean-Marc Amon fournit un merveilleux exemple de la façon d'obtenir l'onglet actif dans ce cas (n'oubliez pas de le voter de façon positive!).

Une fois que vous avez l'onglet actuel, passez simplement update() .

chrome.tabs.getCurrent(function (tab) {
  //Your code below...
  var tabUrl = encodeURIComponent(tab.url);
  var tabTitle = encodeURIComponent(tab.title);
  var myNewUrl = "https://www.mipanga.com/Content/Submit?url=" + tabUrl + "&title=" + tabTitle;

  //Update the url here.
  chrome.tabs.update(tab.id, {url: myNewUrl});
});

NB: Pour utiliser cette fonctionnalité, vous devez vous assurer que vous avez l'autorisation tabs activée dans votre fichier manifest.json:

"permissions": [
  "tabs"
],
68
Dan Atkinson

Vous pouvez également utiliser chrome.tabs.query

chrome.tabs.query({currentWindow: true, active: true}, function (tab) {
      chrome.tabs.update(tab.id, {url: your_new_url});
});
36
Jean-Marc Amon

La méthode chrome.tabs.update S'exécutera automatiquement sur l'onglet actif actuel si aucun identifiant d'onglet n'est transmis.

Cela présente l'avantage supplémentaire de ne pas nécessiter l'autorisation tabs. Les extensions avec cette autorisation avertissent l'utilisateur qu'il peut lire l'historique de navigation, vous devez donc éviter de le demander si vous n'en avez pas besoin.

Changer l'URL de l'onglet actuel est aussi simple que d'écrire ceci:

chrome.tabs.update(undefined, {url: 'http://example.com'});

Ou comme mentionné par farwayer dans les commentaires, vous n'avez pas besoin de mettre deux arguments du tout.

chrome.tabs.update({url: 'http://example.com'});
8
Domino