Chaining nhiều jQuery ajax yêu cầu

Question

Tôi có đoạn mã sau:

$.when(loadProjects()) 
    .then(function() { 

     $.when.apply($, buildRequests(projects)) 
     .then(function(data) { 

      $.when.apply($, vcsRequests(buildTypes)) 
      .then(function(data) { 

       $.when.apply($, vcsDetailRequests(vcsRoots)) 
       .then(function(data) { 
        alert('done'); 
       }); 

      }); 

     }); 

    }); 

Mỗi phòng trong số các chức năng thông qua vào when.apply() mảng trở lại của yêu cầu. Tôi không thể thực hiện các cuộc gọi buildRequests cho đến khi các cuộc gọi từ loadProjects() đã kết thúc khi họ dựa vào thông tin được trả về từ các cuộc gọi đó. Mỗi cuộc gọi phụ thuộc vào thông tin được trả về bởi cuộc gọi trước đó, vì vậy chúng phải theo thứ tự này. Tôi cần biết khi nào tất cả các cuộc gọi đã kết thúc để tôi có thể xử lý dữ liệu được trả lại.

Có cách nào tiếp cận rõ ràng hơn không?

Answer 1

Tôi đã xem qua yepnope.js vào ngày khác. Tôi chưa thử nó, nhưng nó có thể hữu ích nếu bạn đang làm rất nhiều ajax tải.

---

Thực tế suy nghĩ điều này khiến tôi nhận ra rằng yepnope.js không thực sự áp dụng cho trường hợp của bạn. Những gì tôi sẽ xem xét trong trường hợp của bạn là để có loadProjects() et al trả lại một lời hứa bằng cách áp dụng when() nội bộ trong mỗi chức năng. Cũng đặt pipe() sử dụng có thể dẫn đến một cái gì đó giống như

loadProjects().pipe(buildRequests).pipe(vcsRequests).pipe(vcsDetailRequests); 

mẫu buildRequests():

function buildRequests(projects){ 
    // Do something using projects 
    // ... 

    var requestsPromise = ...; // Finally get ajax promise for requests 
    return requestPromise; 
} 

Kết quả của requestPromise sau đó sẽ được chuyển vào chức năng đường ống tiếp theo một khi nó đã được giải quyết/từ chối.

---

Từ các tài liệu trên pipe():

// Example: Chain tasks: 

var request = $.ajax(url, { dataType: "json" }), 
    chained = request.pipe(function(data) { 
     return $.ajax(url2, { data: { user: data.userId } }); 
    }); 

chained.done(function(data) { 
    // data retrieved from url2 as provided by the first request 
}); 

Answer 2

.... phản ứng theo nhận xét của tôi về bài đăng gốc:

Có vẻ bạn có rất nhiều yêu cầu để chuỗi. Sau đó tôi sẽ xem xét kết hợp tất cả yêu cầu thành một đơn .... nhiều hơn nữa hiệu quả hơn chaining ...

Vâng, một cái gì đó như thế này:

PHP: 
$projects = YourAPI::loadProjects(); 
$builds = YourAPI::getBuilds($projects); 
$vcs = YourAPI::getVCS($builds); 
$details = YourAPI::getVCSDetails($vcs); 

// for example 
return json_encode($details); 

// OR, if you need all the data 
$results = array( 
    "projects" => $projects, 
    "builds" => $builds, 
    "vsc" => $vcs, 
    "details" => $details 
); 
return json_encode($results); 

Bằng cách này, bạn có synhronization cố hữu giữa các cuộc gọi VÀ ít HTTP trafiic;)

Answer 3

Chuỗi phụ thuộc yêu cầu AJAX: Bạn có thể chuỗi nhiều yêu cầu AJAX - ví dụ: cuộc gọi đầu tiên truy xuất chi tiết người dùng của người dùng và chúng ta cần chuyển giá trị đó cho tập lệnh thứ hai. Hãy nhớ rằng $.then() trả về một lời hứa mới, sau đó có thể được chuyển đến $.done() hoặc thậm chí một phương thức $.then() khác.

var a1 = $.ajax({ 
      url: '/first/request/url', 
      dataType: 'json' 
     }), 
    a2 = a1.then(function(data) { 
      // .then() returns a new promise 
      return $.ajax({ 
       url: '/second/request/url', 
       dataType: 'json', 
       data: data.userId 
      }); 
     }); 

a2.done(function(data) { 
    console.log(data); 
});