Адмяніць запыты Ajax з дапамогай jQuery

Выкарыстоўваючы jQuery, як я магу адмяніць / перапыніць запыт Ajax, на які я яшчэ не атрымаў адказ?

1634
15 янв. зададзены lukewm 15 студз. 2009-01-15 15:45 '09 а 15:45 2009-01-15 15:45
@ 19 адказаў

Большасць метадаў jQuery Ajax вяртаюць аб'ект XMLHttpRequest (або эквівалентны), таму вы можаце проста выкарыстоўваць abort() .

См. Дакументацыю:

 var xhr = $.ajax({ type: "POST", url: "some.php", data: "name=John success: function(msg){ alert( "Data Saved: " + msg ); } }); //kill the request xhr.abort() 

UPDATE: з jQuery 1.5 які вяртаецца аб'ект з'яўляецца абалонкай для ўласнага аб'екта XMLHttpRequest, званага jqXHR. Гэты аб'ект, як уяўляецца, раскрывае ўсе ўласныя ўласцівасці і метады, таму прыведзены вышэй прыклад усё яшчэ працуе. См . Аб'ект jqXHR (дакумента API jQuery).

АБНАЎЛЕННЕ 2: Пачынаючы з jQuery 3, метад ajax цяпер вяртае абяцанне з дадатковымі метадамі (напрыклад, перапыненне), таму прыведзены вышэй код усё яшчэ працуе, хоць які вяртаецца аб'ект больш не з'яўляецца xhr . См. Блог 3.0 тут .

АБНАЎЛЕННЕ 3: xhr.abort() ўсё яшчэ працуе з jQuery 3.x. Не мяркуйце, што абнаўленне 2 з'яўляецца правільным. Дадатковая інфармацыя аб рэпазітары jQuery Github .

1593
15 янв. адказ дадзены meouw 15 студз. 2009-01-15 15:56 '09 у 15:56 2009-01-15 15:56

Вы не можаце ўспомніць запыт, але вы можаце ўсталяваць значэнне тайм-аўту, пасля якога адказ будзе праігнараваны. См. Гэтую старонку для параметраў jQuery AJAX. Я лічу, што ваш зваротны выклік будзе выклікацца, калі перавышаны перыяд чакання. Для кожнага запыту AJAX ужо ўсталяваны тайм-аўт па змаўчанні.

border=0

Вы таксама можаце выкарыстоўваць метад abort () аб'екта запыту, але, у той час як гэта прымусіць кліента спыніць праслухоўванне падзеі, ён можа, верагодна, не спыніць сервер ад яго апрацоўкі.

106
15 янв. адказ дадзены tvanfosson 15 студз. 2009-01-15 15:55 '09 у 15:55 2009-01-15 15:55

Гэта запыт асінхронны, што азначае, што ён адправіў яго там.

У выпадку, калі ваш сервер пачынае вельмі дарагую аперацыю з-за запыту AJAX, самае лепшае, што вы можаце зрабіць, гэта адкрыць ваш сервер для праслухоўвання запытаў на адмену і адправіць асобны запыт AJAX, які будзе паведамляць сервер, каб спыніць усе, што ён робіць.

У адваротным выпадку проста ігнаруйце адказ AJAX.

70
15 янв. адказ дадзены Yuval Adam 15 студз. 2009-01-15 15:56 '09 у 15:56 2009-01-15 15:56

Захавайце выклікі, якія вы робіце ў масіве, затым выклічце xhr.abort () для кожнага з іх.

HUGE CAVEAT: вы можаце перапыніць запыт, але гэта толькі кліенцкая бок. Серверная бок усё яшчэ можа апрацоўваць запыт. Калі вы выкарыстоўваеце нешта накшталт PHP або ASP з дадзенымі сеансу, звесткі пра сеанс блакуюцца да завяршэння ajax. Такім чынам, каб дазволіць карыстачу працягнуць прагляд вэб-сайта, вы павінны выклікаць session_write_close (). Гэта захоўвае сеанс і разблакуе яго, каб працягнуць працу іншых старонак, якія чакаюць працягу. Без гэтага некалькі старонак могуць чакаць, што блакіроўка будзе выдаленая.

62
28 марта '12 в 14:34 2012-03-28 14:34 адказ дадзены Tei 28 сакавіка '12 У 14:34 2012-03-28 14:34

Запыты AJAX могуць не выконвацца ў тым парадку, у якім яны былі запушчаныя. Замест перапынення вы можаце ігнараваць усе адказы AJAX, за выключэннем апошняга:

  • стварыць лічыльнік
  • Павелічэнне лічыльніка пры запуску запыту AJAX
  • Выкарыстоўвайце бягучае значэнне лічыльніка для "штампа" запыту
  • У зваротным выкліку поспеху параўнайце штамп са лічыльнікам, каб праверыць, ці быў ён самым апошнім запытам

Грубая схема кода:

 var xhrCount = 0; function sendXHR() { // sequence number for the current invocation of function var seqNumber = ++xhrCount; $.post("/echo/json/", { delay: Math.floor(Math.random() * 5) }, function() { // this works because of the way closures work if (seqNumber === xhrCount) { console.log("Process the response"); } else { console.log("Ignore the response"); } }); } sendXHR(); sendXHR(); sendXHR(); // AJAX requests complete in any order but only the last // one will trigger "Process the response" message the last var xhrCount = 0; function sendXHR() { // sequence number for the current invocation of function var seqNumber = ++xhrCount; $.post("/echo/json/", { delay: Math.floor(Math.random() * 5) }, function() { // this works because of the way closures work if (seqNumber === xhrCount) { console.log("Process the response"); } else { console.log("Ignore the response"); } }); } sendXHR(); sendXHR(); sendXHR(); // AJAX requests complete in any order but only the last // one will trigger "Process the response" message 

Дэма на jsFiddle

45
18 янв. адказ дадзены Salman A 18 студз. 2014-01-18 15:55 '14 у 15:55 2014/01/18 15:55

Нам проста трэба было вырашыць гэтую праблему і пратэставаць тры розныя падыходы.

  • адмяняе запыт, прапанаваны @meouw
  • выканаць увесь запыт, але апрацоўвае толькі вынік апошняга адпраўлення
  • прадухіляе новыя запыты да таго часу, пакуль іншы яшчэ не выконваецца

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="button" type="button" value="click" /> 

У нашым выпадку мы вырашылі выкарыстаць падыход №3, паколькі ён стварае меншую нагрузку для сервера. Але я не ўпэўнены на 100%, калі jQuery гарантуе выклік метаду .complete (), гэта можа выклікаць тупіковую сітуацыю. У нашых тэстах мы не змаглі прайграць такую ​​сітуацыю.

36
06 марта '13 в 17:29 2013-03-06 17:29 адказ дадзены oyophant 06 сакавіка '13 у 17:29 2013/03/06 17:29

Заўсёды лепш рабіць нешта падобнае.

 var $request; if ($request != null){ $request.abort(); $request = null; } $request = $.ajax({ type : "POST", //TODO: Must be changed to POST url : "yourfile.php", data : "data" }).done(function(msg) { alert(msg); }); 

Але значна лепш, калі вы праверыце аператар if, каб праверыць, ці з'яўляецца запыт ajax нулявым ці не.

30
15 окт. адказ дадзены Tharindu Kumara 15 каст. 2014-10-15 12:14 '14 у 12:14 2014/10/15 00:14

meouw solution з'яўляецца правільным, але калі вы зацікаўлены ў большай кантролі, вы можаце паспрабаваць Убудова Ajax Manager для jQuery.

19
15 янв. адказ дадзены Prestaul 15 студз. 2009-01-15 18:45 '09 у 18:45 2009-01-15 18:45

Я займаўся пошукам у рэальным часе і патрабаваў адмяніць якія чакаюць запыты, якія, магчыма, занялі больш часу, чым апошні / самы апошні запыт.

У маім выпадку я выкарыстаў нешта накшталт гэтага:

 //On document ready var ajax_inprocess = false; $(document).ajaxStart(function() { ajax_inprocess = true; }); $(document).ajaxStop(function() { ajax_inprocess = false; }); //Snippet from live search function if (ajax_inprocess == true) { request.abort(); } //Call for new request 
11
04 дек. адказ дадзены Billy 04 снеж. 2013-12-04 17:43 '13 у 17:43 2013/12/04 17:43

Як адзначаюць многія людзі ў патоку, толькі таму, што запыт перарываецца на баку кліента, сервер ўсё роўна апрацуе запыт. Гэта стварае залішнюю нагрузку на сервер, таму што ён выконвае працу, якую мы перасталі слухаць у інтэрфейсе.

Праблема, якую я спрабавала вырашыць (іншыя могуць зайсці ў яе), заключаецца ў тым, што калі карыстач уводзіў інфармацыю ў поле ўводу, я хацеў, каб я папрасіў у вас запыт на імгненны тып Google Instant.

Каб пазбегнуць стральбы непатрэбнымі запытамі і падтрымліваць прыхільнасць вонкавага інтэрфейсу, я зрабіў наступнае:

 var xhrQueue = []; var xhrCount = 0; $('#search_q').keyup(function(){ xhrQueue.push(xhrCount); setTimeout(function(){ xhrCount = ++xhrCount; if (xhrCount === xhrQueue.length) { // Fire Your XHR // } }, 150); }); 

Гэта будзе па сутнасці адпраўляць адзін запыт кожныя 150 мс (зменную, якую вы можаце наладзіць для сваіх патрэб). Калі ў вас узніклі праблемы з разуменнем таго, што менавіта адбываецца тут, запішыце xhrCount і xhrQueue ў кансолі непасрэдна перад блокам if.

10
03 февр. адказ дадзены brianrhea 03 февр. 2014-02-03 21:43 '14 у 21:43 2014/02/03 21:43

Проста патэлефануеце xhr. abort () - гэта аб'ект jquery ajax або уласны аб'ект XMLHTTPRequest.

прыклад:

 //jQuery ajax $(document).ready(function(){ var xhr = $.get('/server'); setTimeout(function(){xhr.abort();}, 2000); }); //native XMLHTTPRequest var xhr = new XMLHttpRequest(); xhr.open('GET','/server',true); xhr.send(); setTimeout(function(){xhr.abort();}, 2000); 
9
28 мая '15 в 12:17 2015-05-28 12:17 адказ дадзены cuixiping 28 мая '15 у 12:17 2015/05/28 00:17

няма надзейнага спосабу зрабіць гэта, і я нават не паспрабую яго, як толькі запыт будзе на шляху; адзіны спосаб рэагаваць разумна - гэта ігнараваць адказ.

у большасці выпадкаў гэта можа адбыцца ў такіх сітуацыях, як: карыстальнік занадта часта націскае кнопку на кнопцы, якая запускае шмат паслядоўных XHR, тут у вас ёсць шмат варыянтаў, альбо блакіруйце кнопку да таго часу, пакуль XHR не вернецца, альбо нават не выкліча новы XHR , а другі працуе, намякаючы, каб карыстальнік нахіліўся назад - ці адмяніў які чакае XHR-адказ, але нядаўні.

8
17 июня '15 в 21:44 2015-06-17 21:44 адказ дадзены comeGetSome 17 чэрвеня '15 у 21:44 2015/06/17 21:44

Проста выкарыстоўвайце ajax.abort (), напрыклад, вы можаце перапыніць любы які чакае запыт ajax перад адпраўкай іншага, падобнага на гэта

 //check for existing ajax request if(ajax){ ajax.abort(); } //then you make another ajax request $.ajax( //your code here ); 
8
08 нояб. адказ дадзены Joecoder001 08 лістапада. 2013-11-08 11:07 '13 у 11:07 2013/11/08 11:07

У мяне ўзнікла праблема апытання, і як толькі старонка была зачынена, апытанне працягваўся, таму па маёй прычыне карыстальнік прапусціў абнаўленне, паколькі значэнне mysql ўсталёўвалася на наступныя 50 секунд пасля закрыцця старонкі, хоць я забіў ajax запыт, я зразумеў, што пад час выкарыстаньня $ _SESSION для ўстаноўкі var не будзе абнаўляцца у апытанні, пакуль ён не скончыцца, а новы не запусціцца, таму я зрабіў значэнне ў маім базе дадзеных як 0 = offpage, тым часам як я апытання я Запытаная гэты радок і вяртаю false; калі ён 0 як запыт у апытанні, вы атрымаеце бягучыя значэння, відавочна ...

Я спадзяюся, што гэта дапамагло

4
25 июля '13 в 15:44 2013-07-25 15:44 адказ дадзены Marcus 25 ліпеня '13 ў 15:44 2013/07/25 15:44

У наступным кодзе паказана ініцыяванне, а таксама перапыненне запыту Ajax:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="button" class="go" value="GO!" > <input type="button" class="stop" value="STOP!" > 
4
04 янв. адказ дадзены zloctb 04 студз. 2016-01-04 16:35 '16 у 16:35 2016/01/04 16:35

Я падзяліўся дэманстрацыяй якая дэманструе, як адмяніць запыт AJAX - калі дадзеныя не вяртаюцца з сервера на працягу наканаванага часу чакання.

HTML:

 <div id="info"></div> 

JS CODE:

 var isDataReceived= false, waitTime= 1000; $(function() { // Ajax request sent. var xhr= $.ajax({ url: 'http://api.joind.in/v2.1/talks/10889', data: { format: 'json' }, dataType: 'jsonp', success: function(data) { isDataReceived= true; $('#info').text(data.talks[0].talk_title); }, type: 'GET' }); // Cancel ajax request if data is not loaded within 1sec. setTimeout(function(){ if(!isDataReceived) xhr.abort(); },waitTime); }); within 1sec var isDataReceived= false, waitTime= 1000; $(function() { // Ajax request sent. var xhr= $.ajax({ url: 'http://api.joind.in/v2.1/talks/10889', data: { format: 'json' }, dataType: 'jsonp', success: function(data) { isDataReceived= true; $('#info').text(data.talks[0].talk_title); }, type: 'GET' }); // Cancel ajax request if data is not loaded within 1sec. setTimeout(function(){ if(!isDataReceived) xhr.abort(); },waitTime); }); 
2
12 февр. адказ дадзены ganesh 12 февр. 2016-02-12 08:25 '16 у 08:25 2016/02/12 08:25

Калі xhr.abort(); выклікае перазагрузку старонкі,

Затым вы можаце ўсталяваць onreadystatechange перад тым, як перапыніць, каб прадухіліць:

 // ↓ prevent page reload by abort() xhr.onreadystatechange = null; // ↓ may cause page reload xhr.abort(); 
2
23 окт. адказ дадзены vikyd 23 каст. 2016-10-23 14:56 '16 у 14:56 2016/10/23 14:56

Вы можаце перапыніць любой бесперапынны выклік ajax, выкарыстоўваючы гэты

 <input id="searchbox" name="searchbox" type="text" /> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript"> var request = null; $('#searchbox').keyup(function () { var id = $(this).val(); request = $.ajax({ type: "POST", //TODO: Must be changed to POST url: "index.php", data: {'id':id}, success: function () { }, beforeSend: function () { if (request !== null) { request.abort(); } } }); }); </script> 
1
18 мая '18 в 16:17 2018-05-18 16:17 адказ дадзены Soubhagya Kumar 18 мая '18 у 16:17 2018/05/18 16:17
 $.ajax({ type: "POST", url: "handlername", data: "paramerers", success: function(msg){ alert( "Result: " + msg ); }, error: function() { alert("Error Message"); }, datatype : JSON, async: false, cache: false }); 
-6
03 дек. адказ дадзены Rohit Chidrewar 03 снеж. 2017-12-03 01:20 '17 у 01:20 2017/12/03 01:20

Іншыя пытанні па пазнаках або Задайце пытанне