ASP.NET WEBAPI Post前后端传递参数

单个实体作为参数

当我们需要传递一个实体作为参数该怎么解决呢？我们来看下面的代码便知：

图1

	$.ajax({
    	type: "post",
    	url: "http://localhost:17427/LinePC/saveDatas",
    	data: { type: 1, data: "[{
		\"WorkListNum\":\"183355103\",
		\"ChipNum\":\"CR0402JF0000G\",
		\"OriginListNum\":\"BNV184065039\",
		\"PackageQty\":\"10000\",
		\"TotalInput\":273.1,
		\"OperatorID\":\"00000\",
		\"ReelQty\":273,
		\"ReelStart\":\"001\" ,
		\"ReelEnd\":\"273\"
	}]", secondData: null },
    success: function (data, status) {}
	});

	[HttpPost]
    public string saveDatas(CommonPostData postData)
    {

    }
    public class CommonPostData
    {
        public int type { set; get; }

        public string data { set; get; }

        public string secondData { set; get; }
    }

使用实体作为参数的时候，前端直接传递普通json，后台直接使用对应的类型去接收即可，不用FromBody。但是这里需要注意的一点就是，这里不能指定contentType为appplication/json，否则，参数无法传递到后台。默认contentType为application/x-www-form-urlencoded。

①application/x-www-form-urlencoded ： <form encType=””>中默认的encType，form表单数据被编码为key/value格式发送到服务器（表单默认的提交数据的格式）；
②application/json    ： JSON数据格式

也就是说post请求默认是将表单里面的数据的key/value形式发送到服务，而我们的服务器只需要有对应的key/value属性值的对象就可以接收到。而如果使用application/json，则表示将前端的数据以序列化过的json传递到后端，后端要把它变成实体对象，还需要一个反序列化的过程。

图2

	var postdata = { type: 1, data: "[{
	\"WorkListNum\":\"183355103\",
	\"ChipNum\":\"CR0402JF0000G\",
	\"OriginListNum\":\"BNV184065039\",
	\"PackageQty\":\"10000\",
	\"TotalInput\":273.1,
	\"OperatorID\":\"00000\",
	\"ReelQty\":273,
	\"ReelStart\":\"001\" ,
	\"ReelEnd\":\"273\"
	}]", secondData: null };
	$.ajax({
    	type: "post",
    	url: "http://localhost:17427/LinePC/saveDatas",
    	contentType: 'application/json',
    	data: JSON.stringify(postdata),
    	success: function (data, status) {}
	});

	[HttpPost]
    public string saveDatas(CommonPostData postData)
    {

    }
    
    public class CommonPostData
    {
        public int type { set; get; }

        public string data { set; get; }

        public string secondData { set; get; }
    }

得到结果：

尝试成功，也就是说，两种写法都是可行的。如果你指定了contentType为application/json，则必须要传递序列化过的对象；如果使用post请求的默认参数类型，则前端直接传递json类型的对象即可。

注意下:如果写成如下的Json格式,后端是无法解析的。

图3

var postdata = {
	"type": 2,
	"data": [{
		"WorkListNum": "183355103",
		"ChipNum": "CR0402JF0000G",
		"OriginListNum": "BNV184065039",
		"PackageQty": "10000",
		"TotalInput": 273.1,
		"OperatorID": "00000",
		"ReelQty": 273,
		"ReelStart": "001",
		"ReelEnd": "273"
	}],
	"secondData": null
};
$.ajax({
    type: "post",
    url: "http://localhost:17427/LinePC/saveDatas",
    contentType: 'application/json',
    data: JSON.stringify(postdata),
    success: function (data, status) {}
});

VS编译调试如下:

由于此例子中需要CommonPostData类的data字段为string，所以图3的postData
对象中的data应为string。如图4所示。

图4

var postdata = {
	"type": 2,
	"data":"[{
	\"WorkListNum\":\"183355103\",
	\"ChipNum\":\"CR0402JF0000G\",
	\"OriginListNum\":\"BNV184065039\",
	\"PackageQty\":\"10000\",
	\"TotalInput\":273.1,
	\"OperatorID\":\"00000\",
	\"ReelQty\":273,
	\"ReelStart\":\"001\" ,
	\"ReelEnd\":\"273\"
}]",
	"secondData": null
}; 

如果像图3,data中为Json数组的话,需要把CommonPostData类的data字段类型改为TempClass,
Json反序列化逐级递归的。如图5所示:
图5:

        /// <summary>
        /// 增/删/改
        /// </summary>
        /// <param name="postData"></param>
        /// <returns></returns>
        [HttpPost]
        public string saveDatas(CommonPostData postData)
        {
            return string.Empty;
        }

        public class CommonPostData
        {
            public int type { set; get; }

            public List<TempClass> data { set; get; }

            public string secondData { set; get; }
        }
		public class TempClass
		{
			public string WorkListNum{get;set;}
	
			public string ChipNum{get;set;}
	
			public string OriginListNum{get;set;}
	
			public string PackageQty{get;set;}
	
			public double TotalInput{get;set;}
	
			public string OperatorID{get;set;}
	
			public int ReelQty{get;set;}
		
			public string ReelStart{get;set;}
			
			public string ReelEnd{get;set;}
		}

VS编译调试如下:(postData参数有值啦)