Ajax nhiều yêu cầu cùng một lúc

Question

gần đây tôi đã phát triển một dự án là tôi gửi nhiều yêu cầu ajax tại một trang aspx duy nhất. Tôi cũng đặt một bộ đếm thời gian được yêu cầu này đang xảy ra với khoảng thời gian 5 giây. Mọi thứ dường như hoạt động tốt cho đến khi đột nhiên các câu trả lời kết hợp. Tôi biết rằng tôi có thể làm điều tương tự với một yêu cầu, nhưng tôi tự hỏi tại sao điều này lại xảy ra. Tôi nhìn xung quanh internet nhưng tôi không thể tìm thấy bất kỳ giải pháp nào được nêu ra. Bây giờ tôi thực sự đã áp dụng kiểu mã hóa này như tạo một yêu cầu với nhiều kết quả, nhưng tôi tự hỏi và tôi thực sự muốn biết làm thế nào để thực hiện nhiều yêu cầu ajax là phản hồi sẽ không trộn lẫn. Đây là Mã mẫu của tôi:

$(document).ready(function() { 
     var a = setInterval("request1()", 5000); 
     var b = setInterval("request2()", 5000); 
    }); 

function request1() { 

     $.ajax({ 
      url: 'ajaxhandler.aspx?method=method1' , 
      beforeSend: function (xhr) { 
       xhr.overrideMimeType('text/plain; charset=utf-8'); 
      }, 
      success: function (data) { 
        alert(data); 
      } 

     }); 
    } 


function request2() { 

     $.ajax({ 
      url: 'ajaxhandler.aspx?method=method2' , 
      beforeSend: function (xhr) { 
       xhr.overrideMimeType('text/plain; charset=utf-8'); 
      }, 
      success: function (data) { 
        alert(data); 
      } 

     }); 
    } 

Answer 1

Nếu bạn cần yêu cầu xảy ra theo thứ tự, bạn không nên sử dụng AJAX (là người đầu tiên "a" là dành cho "đồng bộ").

Để giải quyết vấn đề này, bạn có thể gọi request2() trong hàm gọi lại cho "thành công" của yêu cầu đầu tiên của bạn.

function request1() { 
    $.ajax({ 
     url: 'ajaxhandler.aspx?method=method1' , 
     beforeSend: function (xhr) { 
      xhr.overrideMimeType('text/plain; charset=utf-8'); 
     }, 
     success: function (data) { 
       request2(); 
     } 

    }); 
} 

Answer 2

Đây không phải là lỗi JavaScript, điều này sai lầm vì bạn đang gọi một trang duy nhất trong cùng một thời điểm. Nếu bạn có hai trang phía máy chủ cho hai tệp AJAX của bạn thì nó sẽ ổn. Hãy thử tạo hai tệp aspx khác nhau cho bạn khác nhau methods để chúng được gọi cùng nhau.

Nhưng đó không phải là cách hay. Tại sao không gửi phương thức làm tham số và có điều kiện trong tệp aspx của bạn cho các phương pháp khác nhau? Sau đó, nếu bạn có hai (hoặc nhiều) phương pháp được sử dụng cùng một lúc, sau đó chỉ cần gửi cả hai đến máy chủ với một cuộc gọi duy nhất. Bạn sẽ lưu tiêu đề HTTP và độ trễ cuộc gọi cho cuộc gọi của mình.

function requestAll() { 

     $.ajax({ 
      url: 'ajaxhandler.aspx' , 
      data: ['method1', 'method2'], 
      beforeSend: function (xhr) { 
       xhr.overrideMimeType('text/plain; charset=utf-8'); 
      }, 
      success: function (data) { 
        alert(data); 
      } 

     }); 
    } 

Answer 3

Như đã nói, bạn không thể đảm bảo theo thứ tự mà các kết quả trả về ở. Nhưng nếu nó là cần thiết để có thể xác định điều này, bạn có hình dung có thể tạo ra một định danh duy nhất cho mỗi yêu cầu không đồng bộ được thực hiện, sau đó phân loại các câu trả lời đến tương ứng.

Ví dụ mà tôi thấy giải pháp hữu ích như vậy là khi thực hiện các thao tác trên tổ hợp phím (ví dụ: onkeyup). Khi thực hiện một việc như thế này, bạn có thể mã hóa dấu thời gian, số phiên bản hoặc tương tự, để bạn có thể đảm bảo một số thứ tự. Nếu người dùng đang cố gắng tìm kiếm "kiểm tra", có thể là phản hồi tự động hoàn tất cho "tes" sẽ được trả về trước phản hồi cho "te". Nếu bạn chỉ cần ghi đè dữ liệu tự động hoàn thành, thì điều này rõ ràng sẽ không phải là hành vi mong muốn, vì bạn có thể hiển thị kết quả không chính xác cho (các) mã thông báo tìm kiếm hiện tại.

Mã hóa dấu thời gian (hoặc ID duy nhất, số lượt truy cập, số phiên bản, khóa, v.v.) sẽ cho phép bạn kiểm tra để xác minh rằng bạn có phản hồi cập nhật nhất hoặc sắp xếp kết quả theo dấu thời gian nếu bạn cần phải đảm bảo trật tự, vv

Answer 4

Hàm bên dưới sẽ chấp nhận một loạt các url cho các yêu cầu JSON và gọi hàm gọi lại với một loạt kết quả khi tất cả các yêu cầu đã hoàn tất. Nó có thể dễ dàng thích nghi với việc sử dụng không sử dụng JSON.

Ý tưởng là để chặn các phản hồi đến vào một mảng khi chúng đến, và sau đó chỉ gọi lại cuộc gọi khi tất cả các kết quả đang ở. Cách tiếp cận này là một cách hay để cập nhật hàng loạt cho DOM và tránh hẹn giờ nút bạn muốn cập nhật.

function multi_getJSON(urls, callback) 
{ 
    // number of ajax requests to wait for 
    var count = urls.length; 

    // results of individual requests get stuffed here 
    var results = []; 

    // handle empty urls case 
    if(count === 0) 
    { 
     callback(results); 
     return; 
    } 

    urls.forEach(function(url, index) 
    { 
     $.getJSON(url, function(data) 
     { 
      results[index] = data; 
      count = count - 1; 

      // are we finished? 
      if(count === 0) 
      { 
       callback(results); 
      } 
     }); 
    }); 
}