解決ajax請求后臺,有時收不到返回值的問題
昨天下午做項目遇到一個問題,貼出來方便以后翻閱,也給大家個參考。
問題:
具體做的是個文件導入的功能,導入的功能是成功了,但是界面一直得不到返回值,排查了一下午,調(diào)試的時候是可以有返回的,但是關(guān)掉瀏覽器調(diào)試界面,卻得不到返回結(jié)果。
原因:
一直以為是我后臺程序有問題,晚上回到家才想起來ajax的問題,把ajax的異步處理改為同步,就出來效果了,具體的原因請看下文詳解。
jquery中ajax方法有個屬性async用于控制同步和異步,默認是true,即ajax請求默認是異步請求,有時項目中會用到AJAX同步。這個同步的意思是當JS代碼加載到當前AJAX的時候會把頁面里所有的代碼停止加載,頁面出現(xiàn)假死狀態(tài),當這個AJAX執(zhí)行完畢后才會繼續(xù)運行其他代碼頁面假死狀態(tài)解除。而異步則這個AJAX代碼運行中的時候其他代碼一樣可以運行。
ajax中async這個屬性,用于控制請求數(shù)據(jù)的方式,默認是true,即默認以異步的方式請求數(shù)據(jù)。
一、async值為true (異步)
當ajax發(fā)送請求后,在等待server端返回的這個過程中,前臺會繼續(xù) 執(zhí)行ajax塊后面的腳本,直到server端返回正確的結(jié)果才會去執(zhí)行success,也就是說這時候執(zhí)行的是兩個線程,ajax塊發(fā)出請求后一個線程 和ajax塊后面的腳本(另一個線程)
$.ajax({
type:"POST",
url:"Venue.aspx?act=init",
dataType:"html",
success:function(result){ //function1()
f1();
f2();
}
failure:function (result) {
alert('Failed');
},
}
function2();
在上例中,當ajax塊發(fā)出請求后,他將停留function1(),等待server端的返回,但同時(在這個等待過程中),前臺會去執(zhí)行function2()。
二、async值為false (同步)
當執(zhí)行當前AJAX的時候會停止執(zhí)行后面的JS代碼,直到AJAX執(zhí)行完畢后時,才能繼續(xù)執(zhí)行后面的JS代碼。
$.ajax({
type:"POST",
url:"Venue.aspx?act=init",
dataType:"html",
async: false,
success:function(result){ //function1()
f1();
f2();
}
failure:function (result) {
alert('Failed');
},
}
function2();
當把asyn設(shè)為false時,這時ajax的請求時同步的,也就是說,這個時候ajax塊發(fā)出請求后,他會等待在function1()這個地方,不會去執(zhí)行function2(),直到function1()部分執(zhí)行完畢。
Ajax同步與異步的區(qū)別
var returnValue = null;
xmlhttp = createXmlHttp();
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
if (xmlhttp.responseText == "true") {
returnValue = "true";
}
else {
returnValue = "false";
}
}
};
xmlhttp.open("Post",url,true); //異步傳輸
xmlhttp.setRequestHeader("If-Modified-Since","0"); //不緩存Ajax
xmlhttp.send(sendStr);
return returnValue;
在異步時才可以用xmlHttpReq.onreadystatechange狀態(tài)值!下面是異步和同步的不同調(diào)用方式:
xmlHttpReq.open("GET",url,true);//異步方式
xmlHttpReq.onreadystatechange = showResult; //showResult是回調(diào)函數(shù)名
xmlHttpReq.send(null);
function showResult(){
if(xmlHttpReq.readyState == 4){
if(xmlHttpReq.status == 200){
******
}
}
}
xmlHttpReq.open("GET",url,false);//同步方式
xmlHttpReq.send(null);
showResult(); //showResult雖然是回調(diào)函數(shù)名但是具體用法不一樣~
function showResult(){
//if(xmlHttpReq.readyState == 4){ 這里就不用了,直接dosomething吧~
//if(xmlHttpReq.status == 200){
******//dosomething
//}
//}
}
xmlhttp.open("Post",url,true);
如果是同步(false),返回值是true或false,因為執(zhí)行完send后,開始執(zhí)行onreadystatechange,程序會等到onreadystatechange都執(zhí)行完,取得responseText后才會繼續(xù)執(zhí)行下一條語句,所以returnValue一定有值。
如果是異步(true),返回值一定是null,因為程序執(zhí)行完send后不等xmlhttp的響應,而繼續(xù)執(zhí)行下一條語句,所以returnValue還沒有來的及變化就已經(jīng)返回null了。
所有如果想獲得xmlhttp返回值必須用同步,異步無法得到返回值。
同步異步使用xmlhttp池時都要注意:取得xmlhttp時只能新建xmlhttp,不能從池中取出已用過的xmlhttp,因為被使用過的xmlhttp的readyState為4,所以同步異步都會send但不執(zhí)行onreadystatechange。
以上這篇解決ajax請求后臺,有時收不到返回值的問題就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
解決AJAX返回狀態(tài)200沒有調(diào)用success的問題
今天小編就為大家分享一篇解決AJAX返回狀態(tài)200沒有調(diào)用success的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
layui的checbox在Ajax局部刷新下的設(shè)置方法
今天小編就為大家分享一篇layui的checbox在Ajax局部刷新下的設(shè)置方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
jquery ajax 向后臺傳遞數(shù)組參數(shù)示例
在JS中向后臺傳遞數(shù)組參數(shù),如果數(shù)組中放的是對象類型,傳遞到后臺是顯示的只能是對象字符串--[object Object],具體的原因及解決方法如下,有類似問題的朋友可以參考下2013-07-07
淺析json與jsonp區(qū)別及通過ajax獲得json數(shù)據(jù)后格式的轉(zhuǎn)換
一言以蔽之,json返回的是一串數(shù)據(jù);而jsonp返回的是腳本代碼(包含一個函數(shù)調(diào)用);接下來通過本文給大家介紹json與jsonp區(qū)別及通過ajax獲得json數(shù)據(jù)后格式的轉(zhuǎn)換,需要的朋友參考下2016-03-03
使用AJAX異步通信技術(shù)實現(xiàn)搜索聯(lián)想和自動補全示例
這篇文章主要介紹了使用AJAX異步通信技術(shù)實現(xiàn)搜索聯(lián)想和自動補全示例,AJAX是前后臺交互的能? 也就是我們客戶端給服務端發(fā)送消息的?具,以及接受響應的?具,需要的朋友可以參考下2023-05-05

