爲GET查詢編寫Google Chrome瀏覽器擴展

Question

我在嘗試編寫Google Chrome瀏覽器擴展程序，以便突出顯示出現在任何網站上的文本，並在另一個網站上執行GET查詢搜索。它將在新選項卡中打開查詢。

例如，如果我突出顯示文本「谷歌瀏覽器」，並右鍵單擊以激活擴展程序，它將在新標籤頁中打開http://example.com/index.php?q=google%20chrome。

要做到這一點，最好的方法是什麼？

Answer 1

要從您訪問的選項卡中獲取選定的文本，您需要使用Extension Messaging來執行此操作。

例如，讓我們做一個簡單的谷歌搜索擴展，在您的內容腳本，你會有這樣的事情：

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) { 
    if (request.method == "getSelection") 
     sendResponse({data: window.getSelection().toString()}); 
    else 
     sendResponse({}); // snub them. 
}); 

現在，假設你要這樣，當你點擊一個browser action，你background page內發生，你需要聽取onclick事件。

chrome.browserAction.onClicked.addListener(function(tab) { 
    chrome.tabs.sendRequest(tab.id, {method: "getSelection"}, function(response) { 
    var selectedText = response.data; 
    chrome.tabs.create({url: 'http://google.com?q=' + selectedText}); 
    }); 
}); 

一旦你點擊這個圖標（瀏覽器操作），你會發現，它會發送到內容腳本的請求，一旦內容腳本接收到的動作，將選定的文本發回它的有效載荷。然後，您可以根據所選內容向Google打開一個選項卡，以搜索結果。

Answer 2

如果您只是想打開一個新選項卡，則可以使用帶有URL參數的chrome.tabs.create()。要獲取選定文本，請捕獲mouseup事件並使用window.getSelection()獲取選擇內容。