擴(kuò)展JQuery Ajax請(qǐng)求錯(cuò)誤機(jī)制，實(shí)現(xiàn)服務(wù)器端消息回饋。
JQuery使我們?cè)陂_(kāi)發(fā)Ajax應(yīng)用程序的時(shí)候提高了效率，減少了許多兼容性問(wèn)題，但時(shí)間久了，也讓我們離不開(kāi)他。比如簡(jiǎn)單的Jquery Ajax請(qǐng)求的封裝讓我們忘卻了最原始的XmlHttpRequest對(duì)象和他的屬性,方法，也讓我們遠(yuǎn)離事情的真相。
在Ajax項(xiàng)目中，經(jīng)常遇到需要服務(wù)器端返回錯(cuò)誤的消息提示，或者消息碼之類的數(shù)據(jù)。查過(guò)一些幫助，解決方案，很多網(wǎng)站是返回錯(cuò)誤的消息JSON數(shù)據(jù)或者腳本，這種方式當(dāng)我們用JQuery.ajax()的時(shí)候出現(xiàn)了問(wèn)題，jquery.ajax()回調(diào)函數(shù)success(data)的data參數(shù)可能是 xmlDoc, jsonObj, html, text, 等等...這取決于我們dataType設(shè)置和MIME.很多時(shí)候我們的錯(cuò)誤處理都是統(tǒng)一的處理，不管你請(qǐng)求的是XML,JSON...。不光不好統(tǒng)一，還容易出現(xiàn)解析錯(cuò)誤等等情況。參考了Prototyp框架的做法，做了一個(gè)Jquery的錯(cuò)誤擴(kuò)展。
原理：Prototype思路是把服務(wù)器處理結(jié)果狀態(tài)信息寫在Header里面，這種方式既保證了reponse body的干凈，同時(shí)適應(yīng)XML,JSON，HTML,Text的返回情況。
服務(wù)器端只需要 Response.AddHeader("Error-Json", "{code:2001,msg:'User settings is null!',script:''}");
實(shí)現(xiàn)：為了不影響原有的Jquery.ajax方法，同時(shí)不破壞jquery庫(kù)源文件，做了如下擴(kuò)展，代碼很簡(jiǎn)單都能看懂：
;(function($){
var ajax=$.ajax;
$.ajax=function(s){
$.ajax var old=s.error; var errHeader=s.errorHeader||"Error-Json"; s.error=function(xhr,status,err){ var errMsg = window["eval"]("(" + xhr.getResponseHeader(errHeader) + ")"); old(xhr,status,errMsg||err); } ajax(s); }
})(jQuery);
使用方法：
服務(wù)器端：我們是對(duì)錯(cuò)誤進(jìn)行擴(kuò)展，如果要讓jquery.ajax破獲錯(cuò)誤，必須要服務(wù)器端返回非200的錯(cuò)誤碼，由于Opera瀏覽器下面對(duì)400以上的錯(cuò)誤碼，都無(wú)法獲得請(qǐng)求的Header，建議如果要支持Opera，最好返回30*錯(cuò)誤，這是Opera能接受Header的錯(cuò)誤范圍。沒(méi)有做包裝，可以再單獨(dú)把Catch內(nèi)容出來(lái)。
try { context.Response.Write(GetJson(context)); throw new Exception("msg"); } catch { context.Response.ClearContent(); context.Response.StatusCode = 300; context.Response.AddHeader("Error-Json", "{code:2001,msg:'User settings is null!',script:''}"); context.Response.End(); }
客戶端：
$.ajax({ url: this.ajaxUrl, type: "POST", success: callback, error: function(xhr,status,errMsg){ alert(errMsg.code+"<br/>"+errMsg.msg); } });也許不是最好的，但覺(jué)得用起來(lái)很方便，忘了個(gè)寫新增參數(shù)errorHeader:"Error-Json",這個(gè)header頭key根據(jù)你后臺(tái)設(shè)定配置。
如對(duì)本文有疑問(wèn)，請(qǐng)?zhí)峤坏浇涣髡搲?，廣大熱心網(wǎng)友會(huì)為你解答！！ 點(diǎn)擊進(jìn)入論壇
