连续的Ajax调用

Question

我的应用程序设计需要一些帮助.使用Ajax我想连续获得一些PHP资源,但我不认为使用JQuery $.ajax方法检索它们是否合适.

我认为这样的事情意味着错误的设计:

$.ajax({
     url: SERVERURL+'index.php/home/checkAvailability',
     datatype: 'text',
     success: function(data){
        if(data == 'unavailable'){
           // do stuff
        }
        else{
           $.ajax({
              url: SERVERURL+'index.php/home/getWebTree/',
              dataType: 'json',
              success: function(data){
                 // do stuff
              }
           });
        }
     }
  });

任何人都可以给我一个建议来获得更好的设计吗？我怎样才能以更好的方式做同样的事情呢？

谢谢!

编辑:像@arnorhs告诉我们,使用async参数可能是一个解决方案.但我仍然认为还有其他解决方案,而不是使用连续的ajax调用.

EDIT2:checkAvailability并且getWebTree是使用我开发的CodeIgniter的PHP函数,以便使用Http_Request对象从外部服务器获取资源.

function checkAvailability() {
      $this->load->library('pearloader');
      $http_request = $this->pearloader->load('HTTP', 'Request');
      $http_request->setURL('http://myurl');
      $http_request->_timeout = 5;
      $http_request->sendRequest();
      $res = 'available';
      if (!$http_request->getResponseCode())
         $res = 'unavailable';
      return $res;
   }

Answer 1

同时拨打电话

如果你想同时进行所有ajax调用,你可以直接在其他调用之后调用ajax请求.您甚至可以为它们分配相同的成功处理程序.如果你想要一个更"优雅"的方法,我会做这样的事情:

// define a set of requests to perform - you could also provide each one
// with their own event handlers..
var requests = [
    { url: 'http://someurl', data: yourParams   },
    { url: 'http://someurl', data: yourParams   },
    { url: 'http://someurl', data: yourParams   },
    { url: 'http://someurl', data: yourParams   }
];

var successHandler = function (data) {
    // do something
}

// these will basically all execute at the same time:
for (var i = 0, l = requests.length; i < l; i++) {
    $.ajax({
        url: requests[i].url,
        data: requests[i].data,
        dataType: 'text',
        success: successHandler
    });
}

.

做一个请求

我不知道你的用例,但当然你应该尝试做的是检索你在一个请求中检索的所有数据.这不会给您的服务器带来压力,网站/应用程序对用户来说似乎更快,并且是一种更好的长期方法.

我会尝试合并checkAvailability,并getWebTree成一个单一的请求.不是将Javascript中的数据作为文本对象接收,更好的方法是将它们作为json数据接收.幸运的是,PHP提供了非常简单的函数来将对象和数组转换为json,因此您将能够非常轻松地使用这些对象.

编辑:PHP代码中的小修改现在我更了解您的用例.

所以在PHP/CI代码中是这样的:

function getRequestData () {
    if (checkAvailability() == 'available') {
        $retval = array (
            'available' => '1',
            'getWebTree' => getWebTree()
        );
    } else {
        $retval = array (
            'available' => '0'
        );
    }   
    header('Content-type: text/javascript; charset=UTF-8');     
    echo json_encode($retval););
}

然后,Javascript代码可以通过单个ajax请求访问它们:

$.ajax({
    url: 'http://yoururl/getRequestData',
    dataType: 'json',
    success: function (jsonData) {
        // we can now access the parameters like this:
        if (jsonData.checkAvailability) {
            // etc
        }
        //and of course do something with the web tree:
        json.getWebTree
    }
});

.

同步执行请求

如果async在$ .ajax选项中设置参数,则false函数将以同步方式进行,因此代码将停止,直到执行完成为止.或者如文档所述:

asyncBoolean

默认值:true

默认情况下,所有请求都是异步发送的(默认情况下设置为true).如果需要同步请求,请将此选项设置为false.跨域请求和dataType:"jsonp"请求不支持同步操作.请注意,同步请求可能会暂时锁定浏览器,并在请求处于活动状态时禁用任何操作.

见http://api.jquery.com/jQuery.ajax/

Answer 2

如果你真的需要进行两次调用,你可以使用jQuery 1.5中引入的Deffered表达更多.

$.when(checkAvailability())
   .then(getWebTree())
   .fail(function(message){
       if(message === 'Not available!')
       {
           // do stuff
       }
   });

function checkAvailability(){
    var dfd = $.Deferred();

    $.ajax({
    url: SERVERURL+'index.php/home/checkAvailability',
    datatype: 'text',
    success: function(data){              
        if(data == 'unavailable'){
            dfd.reject("Not available!");
        }
        else{
           dfd.resolve();
        }
    }
    });

    return dfd.promise();
};

function getWebTree(){
    $.ajax({
        url: SERVERURL+'index.php/home/getWebTree/',
        dataType: 'json',
        success: function(data){
            // Do stuff
        }
    });
};

请访问http://jsfiddle.net/jimmysv/VDVfJ/查看