Làm cách nào tôi có thể nhận URL của tab hiện tại từ tiện ích mở rộng Google Chrome?

Tôi đang vui vẻ với tiện ích mở rộng của Google Chrome và tôi chỉ muốn biết làm cách nào tôi có thể lưu trữ URL của tab hiện tại trong một biến?

Sử dụng chrome.tabs.query()như thế này:

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

Điều này yêu cầu bạn yêu cầu quyền truy cập vào chrome.tabsAPI trong bảng kê khai tiện ích mở rộng của bạn :

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

Điều quan trọng cần lưu ý là định nghĩa về "tab hiện tại" của bạn có thể khác nhau tùy thuộc vào nhu cầu của tiện ích mở rộng của bạn.

Đặt lastFocusedWindow: truetrong truy vấn là phù hợp khi bạn muốn truy cập tab hiện tại trong cửa sổ tập trung của người dùng (thường là cửa sổ trên cùng).

Cài đặt currentWindow: truecho phép bạn nhận tab hiện tại trong cửa sổ nơi mã của tiện ích mở rộng của bạn hiện đang thực thi. Ví dụ: điều này có thể hữu ích nếu tiện ích mở rộng của bạn tạo cửa sổ / cửa sổ bật lên mới (thay đổi tiêu điểm), nhưng vẫn muốn truy cập thông tin tab từ cửa sổ nơi tiện ích mở rộng được chạy.

Tôi đã chọn sử dụng lastFocusedWindow: truetrong ví dụ này, bởi vì Google gọi ra các trường hợp currentWindow có thể không phải lúc nào cũng có mặt .

Bạn có thể tinh chỉnh thêm truy vấn tab của mình bằng bất kỳ thuộc tính nào được xác định tại đây: chrome.tabs.query

Cảnh báo! chrome.tabs.getSelectedđang bị phản đối . Vui lòng sử dụng chrome.tabs.querynhư thể hiện trong các câu trả lời khác.

Trước tiên, bạn đã đặt quyền cho API trong manifest.json:

"permissions": [
    "tabs"
]

Và để lưu trữ URL:

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

Các câu trả lời khác giả sử bạn muốn biết nó từ cửa sổ bật lên hoặc tập lệnh nền.

Trong trường hợp bạn muốn biết URL hiện tại từ tập lệnh nội dung , cách áp dụng tiêu chuẩn JS:

window.location.toString()

Bạn có thể sử dụng các thuộc tính của window.locationđể truy cập các phần riêng lẻ của URL, chẳng hạn như máy chủ, giao thức hoặc đường dẫn.

Vấn đề là chrome.tabs.getSelected không đồng bộ. Mã này dưới đây thường sẽ không hoạt động như mong đợi. Giá trị của 'tablink' vẫn sẽ không được xác định khi được ghi vào bàn điều khiển vì getSelected chưa gọi lại cuộc gọi lại đặt lại giá trị:

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

Giải pháp là bọc mã nơi bạn sẽ sử dụng giá trị trong hàm và được gọi bởi getSelected. Theo cách này, bạn được đảm bảo luôn có một bộ giá trị, bởi vì mã của bạn sẽ phải chờ giá trị được cung cấp trước khi nó được thực thi.

Hãy thử một cái gì đó như:

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

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

Xin chào, đây là Mẫu Google Chrome gửi email cho Trang web hiện tại cho bạn bè. Ý tưởng cơ bản đằng sau là những gì bạn muốn ... trước hết, nó tìm nạp nội dung của trang (không xen kẽ với bạn) ... sau đó, nó nhận được URL (<- phần tốt)

Ngoài ra, đây là một ví dụ mã làm việc tốt, mà tôi thích đọc hơn Tài liệu.

Có thể tìm thấy ở đây: Gửi email trang này

Giải pháp này đã được KIỂM TRA.

đặt quyền cho API trong manifest.json

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

Trên chức năng gọi tải đầu tiên. https://developer.chrome.com/extensions/tabs#event-onActivated

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

Khi thay đổi chức năng gọi. https://developer.chrome.com/extensions/tabs#event-onSelectionChanged

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

chức năng lấy URL

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

Đối với những người sử dụng context menu api, các tài liệu không rõ ràng ngay về cách lấy thông tin tab.

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

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

Bạn phải kiểm tra điều này .

HTML

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

manifest.json

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

JavaScript
Đoạn mã dưới đây sẽ lưu tất cả các url của cửa sổ đang hoạt động vào đối tượng JSON như một phần của nút bấm.

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);