Hello everyone, I am going to share the multiple AJAX calls on a single page asynchronously. I think you know that the $.Ajax()
is call asynchronously by nature but problem is that multiple(>1000 calls) Async AJAX calls
on a single page. i.e.
$(function () {
$.ajax({
type: "GET",
url: "https://api.github.com/users/anilsingh581",
success: function (data) {
alert(data); }
});
$.ajax({
type: "GET",
url: "https://api.github.com/users/anilsingh5812",
success: function (data) {
alert(data); }
});
$.ajax({
type: "GET",
url: "https://api.github.com/users/anilsingh5813",
success: function (data) {
alert(data); }
});//etc.......
});
But
Its display error : err_insufficient_resources when using chrome any hints.
The solution of above problem
is : $.when() method
//The multiple AJAX requests
by using $.when()
$.when(
$.ajax("https://api.github.com/users/anilsingh581"),
$.ajax("https://api.github.com/users/anilsingh582"),
$.ajax("https://api.github.com/users/anilsingh583"),
$.ajax("https://api.github.com/users/anilsingh584")
)
.done(function (data1, data2,
data3, data4) {
//All AJAX requests are
finished.
alert(data1)
alert(data2)
alert(data3)
alert(data4)
});
OR
$.when($.ajax("/pageurl1.aspx"), $.ajax("/pageurl2.aspx"), $.ajax("/pageurl3.aspx")).then(mySuccess,
myFailure);
var mySuccess = function (result) {
console.log(result);
}
var myFailure = function (result) {
console.log(result);
}
Thank you!