ajax獲取伺服器靜態資源(一個.json檔案),請求成功,有檔案返回,但是ajax回撥卻進了error(一個回車鍵惹出的禍)
問題描述:同事反應問題:向後臺請求json檔案,完了在前臺渲染一個表格,但是始終渲染不出來。
$.ajax({
url: ".../**.json",
type: "get",
dataType: "json",
success: function(data) {
alert(data);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);//textStatus:返回的是字串型別,表示返回的狀態,根據伺服器不同的錯誤可能返回下面這些資訊:"timeout"(超時), "error"(錯誤), "abort"(中止), "parsererror"(解析錯誤),還有可能返回空值。
},
complete: function(XMLHttpRequest, textStatus) {
this; // 呼叫本次AJAX請求時傳遞的options引數
}
});
解決過程:1、斷點除錯,看看程式執行到哪裡出的問題,看到執行到 $.ajax({直接跳出去了,發現ajax未寫error方法;
2、要求其加上error方法後,發現出現:parsererror;
3、搜尋這個錯誤,總結下有很多原因會造成這個錯誤:
跨域、dataType要求的資料型別和返回的不一致、data不能傳空字串(未驗證)、Header 型別(未驗證)等;
4、基於同事說過之前是可以的,現在不行了,我想到可能是json檔案出了問題,於是觀察了一下他怎麼操作的:
為了方便看資料,他把陣列元素只剩下一個元素,其餘都給註釋掉了:
註釋後:
看到這裡,問題也就出來了:
他為了把中間這個逗號註釋掉,按了一下回車,然後註釋的。json裡面多了一個回車符,導致前臺解析出現錯誤!
去掉回車符後,果然就可以了。
這裡總結下,json格式要求,這裡有個重要知識點:jQuery1.4及以上版本不是用eval生成物件了,用的JSON.parse,如果返回格式不標準就會報錯;
像空格、回車符、tab鍵這種,極難發現問題,卻又影響很大,只能說,大家平時要養成一個良好的程式設計習慣。