Chrome扩展程序:为什么我的响应在AJAX调用之前返回?

时间:2011-05-16 10:15:32

标签: javascript google-chrome-extension

我正在从我的popup.html开始进行AJAX调用..

chrome.extension.sendRequest(
                    {
                        req: "send",
                        url: requrl
                    },
                    function(response)
                    {
                        console.log("RESPONSE:" + response.reply);
                    });

此代码在background.html ...

中转到以下情况
                case "send":
                sendResponse({
                    reply: send(request.url)
                });
                break;

反过来调用以下内容......

    function send(uri)
{
    var xhr = new XMLHttpRequest();
    xhr.open("POST",uri,true);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
    xhr.onreadystatechange = function (send){
        if(xhr.readyState == 4){
            return xhr.responseText;
        }
    }
    xhr.send(null);
}

我的问题是我的代码在undefined有机会回复之前返回send()。如何让我的代码等待响应?我需要保持此调用异步,因为我需要未冻结的UI来显示进度对话框。

1 个答案:

答案 0 :(得分:2)

您获得undefined的原因是send函数的结果。如果您查看该功能,它将在send(null)之后退出。返回语句将在一段时间后才会执行,届时将无法接收它。

如果您想在XHR请求完成时做出响应,则需要使用回调。

简而言之:

case "send:"
  send(request.url, function(response) {
    sendResponse(response);
  })

function send(uri, callback) {
  ...
  xhr.onreadystatechange = function (send){
    if(xhr.readyState == 4){
      callback(xhr.responseText);
    }
  }
  ...
}

c.f。 other asynchronous callback questions