jQuery之ajax错误调试分析

jQuery之ajax错误调试分析

jQuery中把ajax封装得非常好。但是日常开发中,我偶尔还是会遇到ajax报错。这里简单分析一下ajax报错

一般的jQuery用法如下,ajax通过post方式提交"汤姆和老鼠"这段数据到xxx.php文件中。成功后则打印返回的数据,失败则打印错误原因。


1

2

3

4

5

6

7

8

9

10

$.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,第二种在谷歌浏览器(其他浏览器也可以)F12下NetWork查看。这时候看到的信息是 5{“status”:“success”}  。不难看出,这个文本中包含了一个json对象的数据,但是不是一个完整json数据。错误发现了,直接去php文件修改相应信息,把多余的打印去除。解决问题。 另外,一个不合格的json对象数据也会导致该问题。例如{‘status‘:‘success‘}数据中是单引号。

案例2问题:前端使用jQuery框架,用到ajax与后端交互,然后让后端操作数据库,后端是nodejs。发现ajax无响应,没有走进success的回调函数,也没有走进error的回调函数。

处理:  首先检查功能有没有实现,发现后端其实是做了处理,数据库已经完成相关修改操作。那问题就很清楚了,后端处理完以后没有给前端响应。在后端处理完后加上相关响应代码即可解决,由此可知,ajax的错误状态码,其实都是后端发送过来的。

-转载

时间: 2024-11-05 12:29:05

jQuery之ajax错误调试分析的相关文章

[转]Jquery中AJAX错误信息调试参考

下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET".注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持. timeout Number 设置请求超时时间(毫秒).此设置将覆盖全局设置. async

JQuery中ajax错误处理之页面跳转

$.ajaxSetup({error: onRequestCompleted}); function onRequestCompleted(xhr,textStatus,errorThrown) { location.href = '/login'; }

【转】JQuery.Ajax之错误调试帮助信息

下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET".注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持. timeout Number 设置请求超时时间(毫秒).此设置将覆盖全局设置. async

[转]JQuery.Ajax之错误调试帮助信息

下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET".注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持. timeout Number 设置请求超时时间(毫秒).此设置将覆盖全局设置. async

JQuery.Ajax之错误调试帮助信息

原文:http://mybloggers.blog.163.com/blog/static/1003865092010111631741468/ 下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET".注意:其它 HTTP 请求方法,如 PUT

jquery ajax 总是还未等到success回调就刷掉了,就进入了onError函数的错误案例分析

jquery ajax 总是还未等到success回调就刷掉了,就进入了onError函数的错误案例分析: 同样的请求同时请求了2次,然后第二次的请求把第一次的给刷掉了! (比如:<div onclick="ajax(url)"><a onclick="ajax(url)">获取接口数据</a></div>)点击“获取接口数据”将触发函数ajax(url)2次!这样就有问题! 比如如果是购物车的“加入购物车”的按钮式这

JQuery.Ajax之错误调试帮助信息 &lt;转&gt;

原文链接:http://mybloggers.blog.163.com/blog/static/1003865092010111631741468/ 下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET".注意:其它 HTTP 请求方法,如 P

jQuery的ajax调用webservice返回XML数据传参错误

jQuery的ajax调用webservice返回XML数据传参错误: 有时候使用jquery的ajax调用带有参数的webservice返回XML格式输出的时候,会出现传参错误,当然错误的原因可能是多种多样的,下面就简单介绍一种. 一.错误代码: 1.ajax代码: $.ajax({ type:"post", url:"_service.asmx/getDataFromATable", data:" { tablename: temp }",

20150430 调试分析之 根据内核报错信息PC指针分析错误

20150430 调试分析之 根据内核报错信息PC指针分析错误 2015-04-30 Lover雪儿 大家写驱动的时候不知道有没有发现,当我们驱动写错了,发生内核奔溃时,会打印一大堆的报错信息, 如果再返回我们的程序中一行一行代码的检查,既耗费时间,并且有些逻辑上的错误,我们是很难看的出来的, 那我们能不能再这一大堆的报错信息中发现问题的所在呢? 此处我们来模拟一个错误,还是沿用上一篇文章中的驱动代码err_led.c的驱动程序中的代码修改错误,当然大家用其他的驱动代码做测试也可以. 博客地址: