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

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

chrome.tabs.query()このように使用します：

chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => {
    let url = tabs[0].url;
    // use `url` here inside the callback because it's asynchronous!
});

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

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

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

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

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

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

ここで定義されているプロパティのいずれかを使用して、タブクエリをさらに自由に調整できます：chrome.tabs.query

警告！chrome.tabs.getSelectedされる非推奨。chrome.tabs.query他の回答にあるようにご利用ください。

まず、manifest.jsonでAPIの権限を設定する必要があります。

"permissions": [
    "tabs"
]

そしてURLを保存するには：

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

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

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

window.location.toString()

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

問題は、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);
}

こんにちは、Google Chromeのサンプルで、現在のサイトを友達にメールで送信しています。背後にある基本的な考え方はあなたが望むものです...まず第一にそれはページのコンテンツをフェッチします（あなたのために興味をそそるものではありません）...その後、それはURLを取得します（<-良い部分）

さらに、それはドキュメントを読むよりも私が好きなように動作する素晴らしいコード例です。

ここで見つけることができます： このページをメールで送信

このソリューションはすでにテスト済みです。

manifest.jsonでAPIの権限を設定する

"permissions": [ ...
   "tabs",
    "activeTab",
    "<all_urls>"
]

最初のロード呼び出し関数。https://developer.chrome.com/extensions/tabs#event-onActivated

chrome.tabs.onActivated.addListener((activeInfo) => {  
  sendCurrentUrl()
})

変更呼び出し機能。https://developer.chrome.com/extensions/tabs#event-onSelectionChanged

chrome.tabs.onSelectionChanged.addListener(() => {
  sendCurrentUrl()
})

URLを取得する関数

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

を使用するユーザーのcontext menu api場合、ドキュメントはタブ情報を取得する方法についてすぐには明確ではありません。

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

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

これを確認する必要があります。

HTML

<button id="saveActionId"> Save </button>

manifest.json

  "permissions": [
    "activeTab",
    "tabs"
   ]

JavaScript
以下のコードは、アクティブなウィンドウのすべてのURLをボタンクリックの一部としてJSONオブジェクトに保存します。

var saveActionButton = document.getElementById('saveActionId');
saveActionButton.addEventListener('click', function() {
    myArray = [];
    chrome.tabs.query({"currentWindow": true},  //{"windowId": targetWindow.id, "index": tabPosition});
    function (array_of_Tabs) {  //Tab tab
        arrayLength = array_of_Tabs.length;
        //alert(arrayLength);
        for (var i = 0; i < arrayLength; i++) {
            myArray.push(array_of_Tabs[i].url);
        }
        obj = JSON.parse(JSON.stringify(myArray));
    });
}, false);