The hole in the API interface for AJAX data requests and data return

Ajax allows Web pages to be updated asynchronously, XMLHttpRequest is the basis of Ajax, most browsers support XMLHttpRequest objects (IE5 and IE6 use ActiveXObject), The XMLHttpRequest object is based on the HTTP protocol used to exchange data with the server in the background.
The HTTP request method provided by the HTTP/1.1 protocol has options,, POST, PUT, DELETE, TRACE, CONNECT. Where post is typically used to submit data to the server, the main point here is how the post submits the data. The HTTP protocol is an ASCII code-based application layer specification based on the TCP/IP protocol. The specification divides the HTTP request into three parts: a status line, a request header, and a message body.
Data is sent out, the service-side parsing is required, and the General Service-side languages such as PHP, Python, and their framework are built with the ability to automatically parse common data formats. The server is typically based on the Content-type field in the request header (headers) to learn how the message body in the request is encoded and then parses the subject. So when it comes to the POST submission data scheme, it contains two parts: the Content-type and the message body encoding method. Cntent-type has the following 4 types of common:
(1) application/x-www-form-urlencoded
This should be the most common way of POST submission data. The native form form of the browser, and if you do not set the Enctype property, the data will eventually be submitted in application/x-www-form-urlencoded manner.
(2) Multipart/form-data
This is another common way of POST data submission. When we use a form to upload a file, the enctyped of the form must be equal to this value.
(3) Application/json
More and more people now use it as a request header to tell the server that the message body is a serialized JSON string. Because of the JSON specification, data is not prone to error.
(4) Text/xml
It is a remote invocation specification that uses HTTP as the transport protocol and XML as the encoding method.

It is important to note that in calling an interface, it is important to pay attention to the way the interface is being requested, and if it is a post, what is the corresponding enctype (that is, what type of Content-type is selected for the request)
Here is an example of a joke interface, where the customer service side is jquery Ajax, the server does not show:
(1) The default content-type is application/x-www-form-urlencoded:

        $.ajax({           type: ‘post‘,            url: ‘http://route.showapi.com/jiekou‘,            dataType: ‘json‘,            data: {                "showapi_appid": ‘666666‘, //这里需要改成自己的appid                "showapi_sign": ‘67596029af7b4cb8bc7afe1c6ffd2333‘,  //这里需要改成自己的应用的密钥secret                "page":"1",                "maxResult":"20"            },            error: function(XmlHttpRequest, textStatus, errorThrown) {                alert("操作失败!");            },            success: function(result) {                console.log(result) //console变量在ie低版本下不能用                alert(result.showapi_res_code)            }        });

Debug the display in Chorme:

Submission of raw data

(2) Content-type:application/json

var jsonstr={
"Showapi_timestamp": Formatterdatetime (),
"Showapi_appid": ' 66666 ',//need to change to their own AppID
"Showapi_sign": ' 67596029af7b4cb8bc7afe1c6ffd2333 ',//This needs to be changed to its own application key secret
"Page": "1",
"Maxresult": "20"
}
$ (function () {
$ (' #create-user '). Click (function () {
$.ajax ({
Type: ' Post ',
URL: ' Http://route.showapi.com/341-1 ',
DataType: ' JSON ',
Data:JSON.stringify (JSONSTR),//convert to JSON string
ContentType: "Application/json",
Error:function (XMLHttpRequest, Textstatus, Errorthrown) {
Alert ("Operation failed!");
},
Success:function (Result) {
Console.log (Result)//console variable is not available under IE lower version
Alert (Result.showapi_res_code)
}
});
});

Debug the display in Chorme:

Raw data submitted by the customer service side:

Complementary points of knowledge:
The difference between a JSON string and a JSON object
JSON object:

var str2 = {"name": "Cool", "Sex": "Man"};

JSON string:

var str1 = ' {' name ': ' haha ', ' sex ': ' Woman '} ';

How to convert in JS:
1. JSON string converted to JSON object

var obj = eval (' (' + str1+ ') ');//eval () function is the JS self-band method
var obj = json.parse (str1); Browser-supported conversion methods
var obj = $.parsejson (str1);//jquery mode
var obj = Str1.parsejson ();//reference Json.js

2. JSON object converted to JSON string

var s=json.stringify (STR2); Browser-supported conversion methods
var s=str2.tojsonstring (); Reference Json.js

The hole in the API interface for AJAX data requests and data return