Chrome扩展程序 - Background.html sendResponse到内容脚本

Question

我在Stockoverflow上看过无数的答案，但似乎没有人帮我回答我的问题。基本上，这是我的代码：

Background.html

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {

    if (request.method == "getIP") {

        var req = new XMLHttpRequest();
        var domain
        var ip = "bla";

        chrome.tabs.getSelected(null,function(tab) {
            domain = tab.url;
            domainSplit = domain.match(/^[\w-]+:\/*\[?([\w\.:-]+)\]?(?::\d+)?/)[1];

            req.open (
                    "GET",
                    "http://colourpad.co.uk/projects/dub3helper/ip.php?" + domainSplit,
                    true);
                req.onreadystatechange = getIP;
                req.send(null);

                function getIP() {
                    if(req.readyState == 4) {
                        var ip = req.responseText;
                        alert (ip);
                        sendResponse({domainToIP: "Tester " + ip });    
                    }   
                }
            });             
        }
    else {
        sendResponse({}); //Snub them
    }

});

内容脚本

chrome.extension.sendRequest({method: "getIP"}, function(response) {
    $("p#versionNumber").append("<span>: " + response.domainToIP + "</span>");
});

脚本的基础工作正常，即它确实将ip作为警报（ip）返回;使用正确的ip数据进行激活。问题似乎是将ip变量发送到我的内容脚本。我认为将sendResponse放在错误的位置可能是一个简单的例子，但我现在真的看不出原因。我是chrome扩展开发的新手。

任何帮助都受到了欢迎，它让我很生气！

Answer 1

你的例子对我来说很好。也许您收到回复，但您的内容脚本没有显示它？尝试console.log(response)而不是那个jquery，并检查控制台的内容脚本和背景页面，可能有一些错误。

对您的背景页面提出一些建议：

而不是：

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

您可以使用：

domain = sender.tab.url;

而不是：

req.onreadystatechange = getIP;
function getIP() {
    ...
}

尝试：

req.onreadystatechange = function() {
    ...
}

<强>更新

尝试关闭：

req.onreadystatechange = (function(sendResponse) {
    return function () {
      if(req.readyState == 4) {
          ... 
      }   
  }
})(sendResponse);

Answer 2

似乎代码与background.html页面上使用的另一个onRequest.addListener冲突。通过将两个单独的侦听器合并为一个由switch案例分隔的侦听器来解决此问题：

chrome.extension.onRequest.addListener(
    function(request, sender, sendResponse)
    {
        switch (request.name)
        {
            case "getPreferences":
            // request from the content script to get the preferences.
            sendResponse(
                {
                    Bla : localStorage["bla"]
                });
            break;
            case "getIP":
            // Convert Domain to IP
                var req = new XMLHttpRequest();
                var domain
                var ip = "bla";

                domain = sender.tab.url;
                domainSplit = domain.match(/^[\w-]+:\/*\[?([\w\.:-]+)\]?(?::\d+)?/)[1];

                req.open (
                        "GET",
                        "http://colourpad.co.uk/projects/dub3helper/ip.php?" + domainSplit,
                        true);
                    req.onreadystatechange = function() {
                        if(req.readyState == 4) {
                            var ip = req.responseText;
                            sendResponse({domainToIP: ip });    
                        }   
                    }
                    req.send(null);
            break;
            default:
            sendResponse({});
        }
    }
);