web-dev-qa-db-ja.com

Google Chrome拡張機能から現在のタブのURLを取得するにはどうすればよいですか？

Google Chrome拡張機能を楽しんでいますが、現在のタブのURLを変数に保存する方法を知りたいだけです。

google-chromegoogle-chrome-extensionbrowser-tab
161
Axiol

更新：chrome.tabs.getSelected() メソッドは廃止されました。

現在のタブのURLを取得する推奨方法は、chrome.tabs.query()を使用することです。

使用例：

chrome.tabs.query({'active': true, 'lastFocusedWindow': true}, function (tabs) {
    var url = tabs[0].url;
});

これには、 拡張マニフェスト でchrome.tabs AP​​Iへのアクセスをリクエストする必要があります。

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

「現在のタブ」の定義は、拡張機能のニーズによって異なる場合があることに注意することが重要です。

クエリでlastFocusedWindow: trueを設定することは、ユーザーのフォーカスされたウィンドウ（通常は一番上のウィンドウ）で現在のタブにアクセスする場合に適しています。

currentWindow: trueを設定すると、拡張機能のコードが現在実行されているウィンドウで現在のタブを取得できます。たとえば、これは、拡張機能が新しいウィンドウ/ポップアップ（フォーカスを変更する）を作成するが、拡張機能が実行されたウィンドウからタブ情報にアクセスしたい場合に便利です。

この例ではlastFocusedWindow: trueを使用することにしました。これは、GoogleがcurrentWindow常に存在するとは限らない のケースを呼び出すためです。

ここで定義されているプロパティのいずれかを使用して、タブクエリをさらに絞り込むことができます。 chrome.tabs.query

183
thauburger

友人が私の質問に答えます。

最初に、タブAPIのアクセス許可を設定する必要があります。

"permissions": [
    "tabs"
]

URLを保存するには：

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

他の回答は、ポップアップまたはバックグラウンドスクリプトからそれを知りたいと仮定しています。

現在のURLを知りたい場合コンテンツスクリプトから、標準のJS方法が適用されます：

window.location.toString()

window.locationのプロパティを使用して、ホスト、プロトコル、パスなど、URLの個々の部分にアクセスできます。

32
Xan

問題は、chrome.tabs.getSelectedが非同期であることです。通常、以下のこのコードは期待どおりに機能しません。 getSelectedは値をリセットするコールバックをまだ呼び出していないため、「tablink」の値はコンソールに書き込まれたときに未定義のままです。

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

解決策は、関数で値を使用する場所でコードをラップし、getSelectedによってその値を呼び出すことです。この方法では、コードは実行される前に値が提供されるのを待つ必要があるため、常に値が設定されていることが保証されます。

次のようなものを試してください：

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

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

こんにちは、Google Chromeサンプルは、現在のサイトを友人にメールで送信します。背後にある基本的なアイデアは、あなたが望むものです...まず最初にページのコンテンツを取得します（あなたのためではありません）...その後、URLを取得します（<-良い部分）

さらに、これは素晴らしい作業コード例であり、ドキュメントを読むよりもずっと好んで使用します。

ここにあります： このページをメールで送信

2
bastianneu

context menu apiを使用している場合、ドキュメントではタブ情報の取得方法がすぐにはわかりません。

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

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

0
lfender6445