jquery's AJAX error debug analysis

The Ajax package is very good in jquery. But in the daily development, I occasionally still encounter Ajax error. Here is a brief analysis of the AJAX error

The general jquery usage is as follows: Ajax submits the "Tom and Mouse" data to the xxx.php file by post. After success, the returned data is printed, and the cause of the error is printed.

12345678910

$.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>    }});

According to the official jquery document, the error in Ajax has three parameters, namely Jqxhr,textstatus,errorthrown.

And there are four properties in JQXHR,

1.readyState: Current state, 0-uninitialized, 1-loading, 2-already loaded, 3-data interacting, 4-done.

2.status: The HTTP status code returned, such as the common 404,500 error code.

3.statusText: the error message corresponding to the status code, such as the 404 error message is not found,500 is internal Server error.

4.responseText: Text message returned by the server response

Both Textstatus and Errorthrown are string types, each of which is the returned state and the server's error message.

In general, Ajax into the error function, the Textstatus and jqxhr.readystate print out, probably know why Ajax error. If it's still unclear, print out all the parameters.

Here is a summary of the situation of Ajax errors encountered, and later encountered new special circumstances to add.

Case 1 : The front-end uses the jquery framework, which uses AJAX to interact with the backend, and the backend is php+mysql. Find Ajax error (Ajax using post type, JSON format, request data as JSON object), print Textstatus is "parsererror", meaning parse error.

Processing: This print shows that Ajax has successfully interacted with the backend (server side), and the backend responds and returns textual information. But the front end accepts this text and parses the error. At this point I first need to see the textual information of the back end response. There are two ways, one is to print Jqxhr.responsetext, and the second to be viewed in Google Chrome (or other browsers) F12 the network. The information you see at this time is 5{"status": "Success"}. It is not difficult to see that this text contains a JSON object's data, but not a complete JSON data. Error found, go directly to the PHP file to modify the corresponding information, the redundant print removal. Solve the problem. Also, a non-conforming JSON object data can cause the problem. For example {' status ': ' Success '} is a single quote in the data.

Case 2 : The front-end uses the jquery framework, which uses AJAX to interact with the backend, and then lets the backend manipulate the database, which is Nodejs. Found that Ajax is unresponsive, does not go into the success callback function, and does not go into the error callback function.

Processing: First check the function has no implementation, found that the backend is actually done the processing, the database has been completed related modification operations. The problem is clear, the backend does not respond to the front end after processing. After processing the backend and then add the relevant response code can be resolved, so that the Ajax error status code, in fact, are sent over the back end.

-Reprint

jquery's AJAX error debug analysis