web-dev-qa-db-fra.com

Extension Chrome: Comment ouvrir un lien dans un nouvel onglet?

Dans mon dossier Stackoverflow, j'ai stackoverflow.ico et 2 fichiers ci-dessous. Lors de l’importation dans Chrome, l’icône apparaît dans la barre d’adresse, mais lorsque je clique dessus, Chrome n’ouvre aucun nouvel onglet. Qu'est-ce que je fais mal?

manifest.json 

{
  "name": "Stackoverflow",
  "version": "1",
  "browser_action":
  {
    "default_icon": "stackoverflow.ico"
  },
  "background":
  {
    "page": "index.html"
  },
  "permissions": ["tabs"],
  "manifest_version": 2
}

index.html 

<html>
  <head>
    <script>
      chrome.browserAction.onClicked.addListener(function(activeTab)
      {
        var newURL = "http://stackoverflow.com/";
        chrome.tabs.create({ url: newURL });
      });
    </script>
  </head>
</html>
javascripthtmlgoogle-chromegoogle-chrome-extensiontabs
56
Tuyen Pham

Le problème est que vous violez content security policy de la version 2 du manifeste. Pour résoudre ce problème, tout ce que vous avez à faire est de vous débarrasser du script en ligne, dans ce cas, votre contexte page. Transformez-le en une variable de fond script comme ceci:

manifest.json

"background":{
  "scripts": ["background.js"]
},

background.js

chrome.browserAction.onClicked.addListener(function(activeTab){
  var newURL = "http://stackoverflow.com/";
  chrome.tabs.create({ url: newURL });
});

Si, pour une raison quelconque, vous avez besoin que ce soit une page, incluez simplement le script en tant que fichier externe et déclarez-le comme une page comme avant.

85
BeardFist

Dans mon cas, je devais ouvrir le lien dans un nouvel onglet lorsque je cliquais sur un lien dans la fenêtre d'extension, cela fonctionnait bien avec l'attribut target défini sur _blank:

<a href="http://www.example.com" target="_blank">Example</a>
1
bruddha

Je préférerais solution plus simple - ajoutez simplement une action à onclick

$('body').on('click', 'a[target="_blank"]', function(e){
    e.preventDefault();
    chrome.tabs.create({url: $(this).prop('href'), active: false});
    return false;
});

Cela ouvrira tous les liens (même créés avec dynamisme) ayant l'attribut target = "_ blank" dans un nouvel onglet sans perdre le focus.

0
fvrab