WebAPI learning diary 1: problems encountered when passing parameters in Ajax requests, webapiajax
First of all, I just graduated from college and want to record some of my learning items. I also want to share it with you. please correct me if there is anything wrong.
Statement: however, all the articles in my blog are examples of my actual operations. They will not be copied or reproduced from the Internet at will and will be responsible for myself and the audience.
What is WebAPI? My understanding is that WebAPI + JQuery (front-end) can basically complete the Web MVC function. That is to say, WebAPI is equivalent to the background part of Web MVC.
Next, let's look at the examples. They are all problems I encountered or found during my learning process.
1. Create a WebAPI Project
(This link is not the focus of this chapter)
Ii. Problems with passing Parameters
Background entity class (Person ):
1 namespace WebApi.Models 2 { 3 public class Person 4 { 5 6 public int ID { get; set; } 7 public string Name { get; set; } 8 public string EnglishName { get; set; } 9 }10 }
Background interface:
1 public class TestController : ApiController 2 { 3 public Person GetEnglishName(int ID, string Name) 4 { 5 Person man = new Person(); 6 man.ID = ID; 7 man.Name = Name; 8 man.EnglishName = "Bert"; 9 return man;10 }11 }
Front-end Ajax requests:
1 <!DOCTYPE html> 2Result:
As shown above, this is the most common Ajax request to access WebApi. Next, let's look at some special examples to better understand and use the parameter passing through WebAPI.
① Modify the Code as follows:
1 public class TestController : ApiController 2 { 3 public Person SetEnglishName(int ID, string Name) 4 { 5 Person man = new Person(); 6 man.ID = ID; 7 man.Name = Name; 8 man.EnglishName = "Bert"; 9 return man;10 }11 }1Result:
Conclusion: Here we only changed the interface name, from GetEnglishName to SetEnglishName. Why can't we find this method? The reason is that WebAPI does not add an access method to the backend method interface (for example, [HttpPost]). If the method name starts with Get, the default request is Get. In the above example, the method name does not indicate the request method or start with Get. It naturally cannot find the method that can be accessed. We recommend that you: no matter what type of requests, set the access type on the method.
② When a post request passes a parameter, data is not in the form of a key/value pair, but data: {":" yzc "}. Remember this special situation, otherwise, the backend cannot obtain the value that the front-end transmits. The reason is that the [FromBody] parameter requested by the Web API has a specific format to be correctly obtained.
③ When multiple parameters are passed in post (the parameter marked with [FromBody] can only appear once, and the parameter marked as [FromUri] can appear multiple times, if the parameter marked as [FromUri] is a simple parameter, this tag can be removed .)
1. data: JSON. stringify (x) and contentType: "application/json" are used together, or 2. data: {is a key-Value Pair}, and contentType: "application/json" cannot be added ", in both cases, the backend [FromBody] parameter can obtain the value. (After testing, if there is a crossover, for example, the key-Value Pair in data and contentType: "application/json" is added, data cannot be accessed in the background)
④ When there are many parameters in the post request, it needs to be encapsulated in a class. In this way, the backend also needs to create a temporary class for receiving, while dynamic can save many classes. However, currently, only data: JSON. stringify (x) and contentType: "application/json" can be used in the background to obtain data in front-end Ajax request parameter configuration.
Front-end request:
1 <!DOCTYPE html> 2Background interface:
1 public class TestController : ApiController 2 { 3 [HttpPost] 4 public Person GetEnglishName(dynamic per) 5 { 6 Person man = new Person(); 7 man.ID = per.ID; 8 man.Name = per.Name; 9 man.EnglishName = "Bert";10 return man;11 }12 }Result:
Iii. Summary:
Not all of the Web API parameter requests in this article are written, but are recorded based on some of the problems I encountered during the learning process. If you do not understand them, we are welcome to discuss them. I think I have learned about software development, but I am also new to this Web API. In many places in this article, I went to test and find information on my own, so some places cannot be well explained, but I believe this is not the end, but the beginning.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
