你的位置:首页 > ASP.net教程

[ASP.net教程]Web Api中的get传值和post传值


GET 方式

get方式传参 我们一般用于获取数据做条件筛选,也就是 “查”

1.无参

复制代码
var look = function () {    $.ajax({      type: "GET",      url: "http://172.28.20.106:8002/api/products/",      dataType: "",      contentType: 'application/'    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });  }
复制代码

2.一个参数

复制代码
var look = function () {    $.ajax({      type: "GET",      url: "http://172.28.20.106:8002/api/users/",      data:{"id":2},      dataType: "",      contentType: 'application/'    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });  }
后台控制器方法如下:
 // GET api/users/5    public string Get(int id)    {      return "id:"+id;    }

当然,也可以这样 把参数放在url

复制代码
  var look = function () {    $.ajax({      type: "GET",      url: "http://172.28.20.106:8002/api/users/2",      dataType: "",      contentType: 'application/'    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });  }

输出:<string id:2</string>

复制代码

3.多个简单参数

后台方法体如下:
 // GET api/users/5    public string Get(int id,string name)    {      return "id:" + id+" name:"+name;    }

 多个参数时也比较简单 指明参数就行了

复制代码
  var look = function () {    $.ajax({      type: "GET",      url: "http://172.28.20.106:8002/api/users",       data:{"id":2,"name":"张飞"},      dataType: "json",      contentType: 'application/json;charset=gb2312;'    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });  }
输出:"id:1 name:张飞"
复制代码

 

4.传递一个对象
后台方法如下:
    [Route("Manger")]    public string Get( Product model)    {      return "id:" + model.Id + " name:" + model.Name;    }

大家可能注意到这个方法上面有个标记了,这个其实是自定义路由,针对重载方法,防止出现匹配到多个适配的方法而报错




这里必须要着重说明下,传递对象并不是理所当然的构造一个对象传过去就可以了
复制代码
var look = function () {    var Product = {      Id: 1,      Name: "张飞",      Category:"212",      Price:22    };    $.ajax({      type: "GET",      url: "http://172.28.20.106:8002/api/users/Manger",      //data:{ "model":{"Id":2,"Name":"张飞","Category":"22","Price":22}},      data: Product ,      dataType: "json",      contentType: 'application/json;charset=gb2312;'    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });  }
这2种情况都会报错
经过多次试验发现,后台方法参数列表内加入
[FromUri]关键字就可以了
加入后的方法如下
复制代码
[Route("Manger")]public string Get([FromUri] Product model){return "id:" + model.Id + " name:" + model.Name;}

输出:"id:1 name:张飞"
复制代码

 

POST方式

   post方式我们一般用来做增 删 改 ,不过在web api中post仅仅用来做增加操作  修改用put 删除用delete

可以看看模板给我们生成的东西

复制代码
    // PUT api/users/5    public string Put(int id, [FromBody]string value)    {      return "id:" + id + "value:" + value;    }    // DELETE api/users/5    public void Delete(int id)    {    }
复制代码

1.post的一个参数

注意:post 提交必须使用

[FromBody]关键字,并且参数列表里面只能有一个关键字,多个无效

 

 

 // POST api/users     [Route("addid")]    public string Post([FromBody]string value)    {      return "值是:" + value;    }

 

惯性思维,然后我们的前台会写成这个样子

复制代码
    $.ajax({      type: "POST",      url: "http://172.28.20.106:8002/api/users/addid",       data: {"value":"1"}    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });
复制代码

结果输出却发现   值是:"

后台并没有收到数据

总结:

  当只有一个参数时,有2种方式是可以获取到值的

 1. data: {"":"1"} //忽略参数名
 2. data: "=1"  //加上”=“号 并且去掉花括号
复制代码
   $.ajax({      type: "POST",      url: "http://172.28.20.106:8002/api/users/addid",      data: {"":"1"}    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });
复制代码

复制代码
  $.ajax({      type: "POST",      url: "http://172.28.20.106:8002/api/users/addid",       data: "=1"    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });
复制代码

输出:"值是:1"

复制代码

复制代码

2.post的多个参数(1个对象)

   注意:post并不能提交多个参数,只能合并成对象

  错误写法:

复制代码
 public string Post(int id,string name)     {       return "id是:" + id+" name:"+name;     }

 public string Post(int id,[FromBody] string name)     {       return "id是:" + id+" name:"+name;     }

正确写法:

 [Route("addmodel")]
public string Post([FromBody] Product value) { return "值是:" + value.Id+" name :"+value.Name; }

前台调用:

复制代码
   var Product = {      Id: 1,      Name: "张飞",      Category: "212",      Price: 22          };    $.ajax({      type: "POST",      url: "http://172.28.20.106:8002/api/users/addmodel",      data: Product    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });
复制代码

输出:  "值是:1 name :张飞"

 

3.post的多个参数(多个对象)

    如果有多个对象,那就只能把它封装在一个扩展对象里面了

   

复制代码
public class User  {    public int ID { get; set; }    public int Name { get; set; }  }public class Product  {    public int Id { get; set; }    public string Name { get; set; }    public string Category { get; set; }    public decimal Price { get; set; }  }//实体扩展类 public class NewProduct  {    public User user { get; set; }    public Product product { get; set; }  }
复制代码

接下来就以扩展类为参数,后台代码变成这样

     [Route("addnewmodel")]     public string Post([FromBody] NewProduct value)     {       return "userid值是:" + value.user.ID + " priduct值是 :" + value.product.Name;     }

接下来就是前台调用

复制代码
  var Product = {      Id: 1,      Name: "手机",      Category: "212",      Price: 22          };    var User = {      Id: 1,      Name: "张飞",    };    $.ajax({      type: "POST",      url: "http://172.28.20.106:8002/api/users/addnewmodel",       data: { Product: Product ,User:User}    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });
复制代码

输出: "userid值是:1 priduct值是 :手机"

 

也可以写成这样

复制代码
 $.ajax({      type: "POST",      url: "http://172.28.20.106:8002/api/users/addnewmodel",      data: {         Product: { Id: 1, Name: "手机", Category: "212", Price: 22 }, User: { Id: 1, Name: "张飞", }      }    }).success(function (res) {      console.log(res);    }).error(function (xhr, status) {      console.log(xhr);    });
复制代码

 

自定义路由

额外的提一下,由于我代码中大量用到它,还是介绍一下
使用场景:用于方法重载 忽略方法名 自定义url(更好看点)

使用步骤:
1.在控制器类上方加入一个标记
  [RoutePrefix("api/users")]  public class UsersController : ApiController  {  }

里面的内容可以根据自己的喜好来定义

2.在方法中加入路由标记[Route("Manger")]

   [Route("Manger")]    public string Get([FromUri] Product model)    {      return "id:" + model.Id + " name:" + model.Name+" price:"+model.Price;    }

这样再访问时就可以使用

api/users/Manger  

 

注意:如果想实现第2步,必须先实现第一步,不然会报错