Как завершить все ajax запросы на jquery. Вы я верен знаете, что все события в JavaScript происходят последовательно. То, что называется асинхронным ajax запросом, на самом деле ем что иное, как цепь последовательных событий. И так случается, то если запросы происходят к одному серверу, что пока не завершится один запрос, другой будет висеть в воздухе. В связи с этим возникла необходимость, обрубать все текущие ajax запросы, при инициализации нового. Как это сделать?
Как это работает при обычном запросе.
var xhr = $.get('index.php'), // первый запрос
xhr2 = $.get('index2.php'); // второй запрос
xhr.abort();// рубим его
xhr2.abort();// рубим его
xhr = $.get('dsds.php'); // третий запрос
Но, что если у Вас нет возможности запоминать все запросы в переменную, а обрубить надо их все.
На помощь придет сама jQuery. Дело в том, что при каждом ajax запросе, jQuery вызывает ряд обработчиков.
jQuery.ajaxStart() - при отправке любого запроса jQuery.ajaxSuccess() - при благополучном завершении любого запроса jQuery.ajaxError() - при не благополучном завершении любого запроса jQuery.ajaxComplete() - при завершении любого запроса
Повесить обработчик на событие можно, точно также, как и на любые другие
jQuery.ajaxStart(function(){
alert('ajax запрос начат')
})
Воспользуемся этим, и при каждом запросе. будем запоминать его xhr
$.xhrPool = [];
$.xhrPool.abortAll = function() {
$(this).each(function(idx, jqXHR) {
jqXHR.abort();
});
$.xhrPool.length = 0
};
$.ajaxSetup({
beforeSend: function(jqXHR) {
$.xhrPool.push(jqXHR);
},
complete: function(jqXHR) {
var index = $.xhrPool.indexOf(jqXHR);
if (index > -1) {
$.xhrPool.splice(index, 1);
}
}
});
В детали вдаваться не стану. Суть думаю ясна. Все запросы складируются в массив $.xhrPool, и чтобы завершить все текущие запросы, просто нужно вызвать метод
$.xhrPool.abortAll();
вот и все, теперь можно начинать все с нуля.
Конечно можно писать все первым способом, это просто. А можно делать все по уму, тогда поддерживать такой код станет намного проще, ведь никаких изменений в аш первоначальный код вносить не надо. Это и есть парадигма разделения кода, которую несет ООП и событийное программирование.
Комментарии