jQuery中把ajax封裝得非常好。但在日常開發中,我偶爾還是會遇到ajax報錯。這裡簡單分析一下ajax報錯
一般的jQuery用法如下,ajax透過post方式提交"湯姆和老鼠"這段資料到xxx.php檔案中。成功後則列印傳回的數據,失敗則列印錯誤原因。
$.ajax({ url:"xxx.php", type:"post", datatype:"json", data:{"cat":"tom","mouse":"jack"}, success:function(data){ console.log(data); }, error:function(jqXHR,textStatus,errorThrown){<br> console.log(jqXHR.);<br> console.log(textStatus);<br> console.log(errorThrown);<br> } });
根據jQuery官方文檔,ajax中error有三個參數,分別是 jqXHR,textStatus,errorThrown。
而jqXHR中也有四個屬性,
1.readyState :當前狀態,0-未初始化,1-正在載入,2-已經載入,3-資料進行交互,4-完成。
2.status :傳回的HTTP狀態碼,例如常見的404,500等錯誤代碼。
3.statusText :對應狀態碼的錯誤訊息,例如404錯誤訊息是not found,500是Internal Server Error。
4.responseText :伺服器回應回傳的文字訊息
textStatus和errorThrown都是字串類型,分別是傳回的狀態和伺服器的錯誤訊息。
一般情況下,ajax走進error的函數裡,把textStatus和jqXHR.readyState印出來,大概就知道為什麼ajax報錯了。如果還是不清楚的話,就把所有參數都印出來。
這裡總結一下ajax錯誤遇到的情況,以後遇到新的特殊情況再補充。
案例1
問題:前端使用jQuery框架,用到ajax與後端交互,後端是php+mysql。發現ajax報錯(ajax採用post類型,json格式,請求資料為Json物件),列印textStatus是“parsererror”,意為解析錯誤。
處理:這個列印說明ajax已經與後端(伺服器端)互動成功,後端回應並回傳了文字訊息。但是前端接受到這個文字後解析錯誤。這時候我首先需要看到後端回應的文字訊息。有兩種方式,一種是列印jqXHR.responseText,第二種在Google瀏覽器(其他瀏覽器也可以)F12下NetWork檢視。這時候看到的訊息是 5{“status”:“success”} 。不難看出,這個文本包含了一個json物件的數據,但是不是一個完整json數據。錯誤發現了,直接去php檔案修改對應訊息,把多餘的列印去除。解決問題。 另外,一個不合格的json物件資料也會導致該問題。例如{'status':'success'}資料中是單引號。
案例2
問題:前端使用jQuery框架,用到ajax與後端交互,然後讓後端操作資料庫,後端是nodejs。發現ajax無反應,沒有走進success的回呼函數,也沒有走進error的回呼函數。
處理:首先檢查功能有沒有實現,發現後端其實是做了處理,資料庫已經完成相關修改操作。那問題就很清楚了,後端處理完以後沒有給前端回應。在後端處理完後加上相關回應碼即可解決,由此可知,ajax的錯誤狀態碼,其實都是後端發送過來的。
以上是個人開發過程中遇到的問題及處理總結,若有不正之處,望提出指正,萬分感激!