chrome扩展，将数据从内容传递到后台

Question

我创建了一个由 manifest.json、content.js 和 background.js 组成的 chrome 扩展。在 content.js 中，我正在提取当前选项卡的 URL，在 background.js 中，我正在打开一个新选项卡。我想要做的是从内容中传递 URL 并将其附加到我在后台调用的 URL 中，这是行不通的。

content.js：

chrome.extension.onMessage.addListener(function(request, sender, sendResponse)
{
    if(request.greeting=="gimmieyodatas")
    {
    var output ="URL=";
    //check for the character '?' for any parameters in the URL
    var paramIndex = document.URL.indexOf("?");
    //if found, eliminate the parameters in the URL
    if (paramIndex > -1)
    {
        output += document.URL.substring(0, paramIndex);
    };
        sendResponse({data: output});
    }
    else{
        sendResponse({}); 
    }
});

background.js：

var output2;
chrome.tabs.getSelected(null, function(tab) {
  chrome.tabs.sendMessage(tab.id, {greeting:"gimmieyodatas"}, function(response) {
    output2 = response.data;
  });
});
chrome.browserAction.onClicked.addListener(function() {
    chrome.tabs.create({url: "http://www.google.com?" + output2}, function(tab) {
        chrome.tabs.executeScript(tab.id, {file: "content.js"}, function() {
            sendMessage();
        });
    });
});

当我从打开的选项卡运行扩展程序时，它会在新选项卡上打开 google，但它不会在 google URL 中附加当前选项卡的 URL，这意味着“输出”数据不会传递给 background.js .我做错了什么？

Answer 1

问题是您没有告诉后台页面在打开新标签时发送消息。对 chrome.tabs.getSelected 的调用仅在第一次运行扩展程序时发生一次——它不会在每次打开新选项卡时发生。

通过使用背景页面作为两个内容页面之间的中介，您走在正确的轨道上，但我建议采用不同的方法：

每次打开新标签时通过清单文件加载内容脚本：

"content_scripts": [
    {
        "matches" : [
            "<all_urls>"
        ],
        "js" : [
            "content.js"
        ]
    }
],

使用更简单的内容脚本，只要加载当前 URL 页面，它就会立即向后台发送一条消息：

（内容.js）

var paramIndex = document.URL.indexOf('?');
if (paramIndex > -1) {
    chrome.runtime.sendMessage({output2: 'URL=' + document.URL.substring(0, paramIndex)});
}

当后台页面收到消息时，它会将 URL 保存到全局变量中：

（背景.js）

var output2;
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    output2 = request.output2;
});

然后您可以在单击操作按钮时加载该 URL：

（背景.js）

chrome.browserAction.onClicked.addListener(function() {
    chrome.tabs.create({url: "http://www.google.com?" + output2});
});