ajax获取服务器静态资源(一个.json文件),请求成功,有文件返回,但是ajax回调却进了error(一个回车键惹出的祸)

时间:2024-03-26 17:01:47

问题描述:同事反应问题:向后台请求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文件出了问题,于是观察了一下他怎么操作的:

                       为了方便看数据,他把数组元素只剩下一个元素,其余都给注释掉了:

ajax获取服务器静态资源(一个.json文件),请求成功,有文件返回,但是ajax回调却进了error(一个回车键惹出的祸)        注释后:ajax获取服务器静态资源(一个.json文件),请求成功,有文件返回,但是ajax回调却进了error(一个回车键惹出的祸)

看到这里,问题也就出来了:

他为了把中间这个逗号注释掉,按了一下回车,然后注释的。json里面多了一个回车符,导致前台解析出现错误!

去掉回车符后,果然就可以了。

这里总结下,json格式要求,这里有个重要知识点:jQuery1.4及以上版本不是用eval生成对象了,用的JSON.parse,如果返回格式不标准就会报错;

像空格、回车符、tab键这种,极难发现问题,却又影响很大,只能说,大家平时要养成一个良好的编程习惯。