web-dev-qa-db-ja.com

Chrome extension：新しいタブでリンクを開く方法は？

Stackoverflowフォルダーには、stackoverflow.icoおよび2つの以下のファイル。 Chromeにインポートすると、アドレスバーにアイコンが表示されますが、クリックしてもChromeは新しいタブを開きません。何が間違っていますか？

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
61
Tuyen Pham

問題は、違反していることです マニフェストバージョン2のcontent security policy 。修正するには、インラインスクリプト、この場合は背景pageを削除するだけです。これを背景scriptに変えます：

manifest.json

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

background.js

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

何らかの理由でページにする必要がある場合は、スクリプトを外部ファイルとしてインクルードし、以前のようにページとして宣言します。

92
BeardFist

私の場合、拡張機能ポップアップウィンドウ内のリンクをクリックしたときに新しいタブでリンクを開く必要がありましたが、target属性を_blankに設定すると正常に機能しました。

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

シンプルなソリューション -onclickにアクションを追加するだけです

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

これにより、ポップアップフォーカスを失うことなく、新しいタブでtarget = "_ blank"属性を持つすべてのリンク（動的に作成されたリンクも含む）が開きます。

1
fvrab