WebAPI GET and POST requests: webapigetpost requests

WebAPI GET and POST requests: webapigetpost requests

GET request

1. No parameter get request

Generally, get requests can be written in either of the following ways:$. Get () is $. ajax ({type: "get "}),I personally prefer the latter.

The following example shows a get request with no parameters. Obtain the personnel list, return the data to the foreground, and convert the returned json data to a string to display the result so that you can check whether the request is successful and whether the returned data is correct.

1 $. ajax ({2 url: "/api/Person/getList", 3 type: "get", 4 success: function (data) {5 alert (JSON. stringify (data); 6 alert ("successful"); 7}, 8 error: function () {9 alert ("error"); 10} 11 });

Background code

1 public class PersonController: ApiController 2 {3 4 public List <Person> getList () 5 {6 var PersonList = new List <Person> () {7 new Person {Name = "Zhang He", Sex = "male", Duty = "engineer", CompanyName = "Beijing XX Technology Co., Ltd "}, 8 new Person {Name = "Zhang Li", Sex = "female", Duty = "engineer", CompanyName = "Beijing XX Technology Co., Ltd "}, 9 new Person {Name = "Zhang chunlei", Sex = "male", Duty = "engineer", CompanyName = "Beijing XX Technology Co., Ltd."} 10}; 11 return PersonList; 12} 13}

2. the Get request of multiple parameters, in the format of data: {}. For example, if a get request of a parameter is data: {"Name": "Zhang Li"}, two parameters: data: {"Name": "Zhang Li", "Sex": "female"}. Multiple parameters are added.

1 $. ajax ({2 url: "/api/Person/GetPerson", 3 type: "get", 4 data: {"Name": "Zhang Li", "Sex ": "female"}, 5 success: function (data) {6 alert (data. name + "" + data. duty + "" + data. companyName); 7}, 8 error: function () {9 alert ("error"); 10} 11 });

Background code

1 public Person GetPerson (string Name, string Sex) 2 {3 var PersonList = new List <Person> () {4 new Person {Name = "Zhang and ", sex = "male", Duty = "engineer", CompanyName = "Beijing XX Technology Co., Ltd."}, 5 new Person {Name = "Zhang Li", Sex = "female ", duty = "engineer", CompanyName = "Beijing XX Technology Co., Ltd."}, 6 new Person {Name = "Zhang chunlei", Sex = "male", Duty = "engineer ", companyName = "Beijing XX Technology Co., Ltd."} 7}; 8 var p = PersonList. firstOrDefault (f => f. name = Name & f. sex = Sex); 9 return p; 10}

Final Effect

 

 

POST request

1. POST requests without Parameters

The post request without parameters is the same as the GET request, except that the type: "get" in ajax is changed to type: "post". The backend function must add the [HttpPost] tag, it is mainly used to mark this function as a post Request function. If a get request does not contain this function.

2. a POST request with a parameter

THE post request and get request methods of a parameter are different. The parameters of the background function must be marked with [FromBody] to access this function. If [FromBody], ASP. NET Web API can correctly identify our UserController to process Post/api/Person, but cannot find an acceptable method to process requests. Then someone said that the backend parameter is added with [FromBody], and the following JavaScript code can be used to request success?

 

1 $. ajax ({2 url: "/api/Person/Post_Person", 3 type: "post", 4 data: {"Name": "Zhang Li"}, 5 success: function (data) {6 alert ("successful"); 7 alert (data); 8 alert (data. name + "" + data. companyName); 9}, 10 error: function () {11 alert ("error"); 12} 13 });

 

The answer is a failure. Specifically, the Post_Person method in the PersonControler can be accessed, but the parameter of the Post_Person function cannot be obtained from the front-end ajax. Why? The reason is that the [FromBody] parameter required by the Web API request must have a specific format before it can be obtained correctly. This specific format is not common key = value pairs. The Web API Model binder wants to find the value without a key name in [FromBody], that is, it is not key = value, but = value.

Therefore, you can change data: {"Name": "Zhang Li"} to data: {"": "Zhang Li"} so that the background function can correctly receive the passed parameter values.

3. POST requests with multiple parameters

Some people think that the Post request with multiple parameters is simply adding multiple parameters with the [FromBody] flag to the background function. If you think so, you are wrong. Be sure to remember multiple parameter POST requests,

[FromBody] can contain only one modified parameter. We need to encapsulate multiple parameters passed.

 

 

1 var Person = {2 Name: "Zhang Li", 3 Sex: "female", 4 Duty: "ddd", 5} 6 7 $. ajax ({8 url: "/api/Person/Post_PersonObj", 9 type: "post", 10 data: Person, 11 success: function (data) {12 alert ("successful"); 13 alert (data); 14 alert (data. name + "" + data. companyName); 15}, 16 error: function (data) {17 alert (data. responseText); 18} 19 });

 

Background code

1 [HttpPost] 2 public Person Post_PersonObj ([FromBody] Person per) 3 {4 var PersonList = new List <Person> () {5 new Person {Name = "Zhang and ", sex = "male", Duty = "engineer", CompanyName = "Beijing XX Technology Co., Ltd."}, 6 new Person {Name = "Zhang Li", Sex = "female ", duty = "engineer", CompanyName = "Beijing XX Technology Co., Ltd."}, 7 new Person {Name = "Zhang chunlei", Sex = "male", Duty = "engineer ", companyName = "Beijing XX Technology Co., Ltd."} 8}; 9 var p = PersonList. firstOrDefault (f => f. name = per. name & f. sex = per. sex); 10 return p; 11}




Source code for the entire example: http://pan.baidu.com/s/1mgooA8K