好了,有了前页几节的铺垫,终于可以写点东西了。

下面带来get post的基本使用。

后台代码:

 1 using System.Collections.Generic;
 2 using System.Web.Http;
 3 
 4 namespace WebApi2017.Controllers
 5 {
 6 
 7     [CrossSite]
 8     public class ApiDemoController : ApiController
 9     {
10         // GET 访问路径 {域名}/api/ApiDemo/Get 用于查询       
11         public IEnumerable<string> Get()
12         {
13             return new string[] { "value1", "value11" };
14         }
15         // GET 访问路径 {域名}/api/ApiDemo/Get2 用于查询       
16         public IEnumerable<string> Get2()
17         {
18             return new string[] { "value2", "value22" };
19         }
20 
21         // GET 访问路径 {域名}/api/ApiDemo/Get/1 用于查询
22         public string Get(int id)
23         {
24             return "value1";
25         }
26         // GET 访问路径 {域名}/api/ApiDemo/Get2/1 用于查询
27         public string Get2(int id)
28         {
29             return "value2";
30         }
31         public string Get3(int id,string a,string b,string c)
32         {
33             return id+ "Get3" + a+b+c;
34         }
35        public class abc1{
36             public int id { get; set; }
37             public string a { get; set; }
38             public string b { get; set; }
39             public string c { get; set; }
40         }
41         public string Post3(abc1 abc1)
42         {
43             return abc1.id + "post3" + abc1.a + abc1.b + abc1.c;
44         }
45 
46         // Post 访问路径 {域名}/api/ApiDemo/Post {参数实体类} 用于新增
47         public void Post([FromBody]string value)
48         {
49         }
50 
51         // Put访问路径 {域名}/api/ApiDemo/Put {参数实体类,要有一个id参数} 用于修改
52         public void Put(int id, [FromBody]string value)
53         {
54         }
55 
56         // Put访问路径 {域名}/api/ApiDemo/Delete/1 用于删除
57         public void Delete(int id)
58         {
59         }
60     }
61 }

 

前台代码:

 1 @{
 2 //Layout = null;
 3 }
 4 <!DOCTYPE html>
 5 <html>
 6 <head>
 7     <meta name="viewport" content="width=device-width" />
 8     <title></title>
 9     <script src="~/Scripts/jquery-1.10.2.min.js"></script>
10     <script>
11         var url1 = "http://" + window.location.host + "/api/apidemo";
12         function submitbtn() {
13             $.ajax({
14                 url: url1 + "/get/1",
15                 type: "GET",
16                 success: function (data) {
17                     $("#div1").html(data);
18                 }
19             });
20         }
21         function submitbtn2() {
22             $.getJSON(url1 + "/get2/1", function (data) {
23                 $("#div1").html(data);
24             })
25         }
26         function submitbtn3() {
27             $.ajax({
28                 url: url1 + "/get3",
29                 type: "get",
30                 data: {
31                     id: 1,
32                     a: "a1",
33                     b: "b1",
34                     c: "c1"
35                 },
36                 success: function (data) {
37                     $("#div1").html(data);
38                 }
39 
40             })
41         }
42         function post3() {
43             $.ajax({
44                 url: url1 + "/post3",
45                 type: "post",
46                 data: {
47                     id: 1,
48                     a: "a1",
49                     b: "b1",
50                     c: "c1"
51                 },
52                 success: function (data) {
53                     $("#div1").html(data);
54                 }
55 
56             })
57         }
58 
59     </script>
60 </head>
61 <body>
62     <div>
63         <div id="div1"></div>
64         <input type="button" value="获取get方法" onclick="submitbtn()" />
65         <input type="button" value="获取get2方法" onclick="submitbtn2()" />
66         <input type="button" value="获取get3方法" onclick="submitbtn3()" />
67         <input type="button" value="获取post3方法" onclick="post3()" />
68     </div>
69 </body>
70 </html>

又上面代码可以看出get方法很简单,随便传几个参数都可以。

post的方法有点不一样,原因是public void Post([FromBody]string value)  看出post 需要一个整体,所以不能像get方法一样随意传参,最佳方法需要使用实体类来解决,前面我们讲过了,post一般用于新增方法,也是很方便的方法。

posted on 2017-02-23 17:40  cxd1008  阅读(422)  评论(0编辑  收藏  举报