大家好,问个mvc4 webapi 的问题 谢谢,请进
初识WebApi 请教个问题
请问在 Controller Action里 , 如何接收 前端ajax post 的 json 数据?
例如:
前端:
$.ajax({
type: "post",
url: "http://localhost:2896/api/TestApi",
data: [{"N":"aaa","A":"bbb"},{"N":"ccc","A":"ddd"}],
dataType: "json",
success: function (content) {
},
error: function (con) {
}
});
Post 了 [{"N":"aaa","A":"bbb"},{"N":"ccc","A":"ddd"}] 这个Json
后端 Controller 里
[HttpPost]
public void SetTestMethod(List<TestC> value)
{
理论上 在这里 value 的count 应该是 2 有两条数据
可实际上 断点到这里 value 的 count 是 0
请问如何解决???????????????????????????
}
public class TestC
{
public String N { get; set; }
public String A { get; set; }
}
[解决办法]
data: [{"N":"aaa","A":"bbb"},{"N":"ccc","A":"ddd"}],
=>
data: [{N:"aaa",A:"bbb"},{N:"ccc",A:"ddd"}],
[解决办法]
关键是$.ajax默认post的时候content-type=application/x-www-form-urlencoded
这个时候 data: jsonObject 时候,无法正确的进行form-urlencoded.
假设,服务端服务如下:
[HttpPost]
public JsonResult PostTest([FromBody]TestObj[] testObjs)
{
JsonResult result = new JsonResult { Status = 0, Result = string.Format("get list count: {0}", testObjs.Length) };
return result;
}
客户端ajax代码:
$(function () {
$("#btnTest").click(function () {
$.ajax({
url: "api/values",
type: "POST",
dataType: "json",
data: [{ "A": "a", "B": "b" }, { "A": "a1", "B": "b1" }],
success: function (data) {
alert(JSON.stringify(data));
},
error: function (data) {
alert(JSON.stringify(data));
}
});
});
});
那么,服务端获得数组长度=0,为什么呢?
通过chrome,查看提交的request如下:
---------------------------------------------------
Request URL:http://localhost:6583/api/values
Request Method:POST
Status Code:200 OK
Request Headersview source
Accept:application/json, text/javascript, */*; q=0.01
Accept-Charset:GBK,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:zh-CN,zh;q=0.8
Connection:keep-alive
Content-Length:21
Content-Type:application/x-www-form-urlencoded; charset=UTF-8
Host:localhost:6583
Origin:http://localhost:6583
Referer:http://localhost:6583/
User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.17 (KHTML, like Gecko) Chrome/24.0.1312.57 Safari/537.17
X-Requested-With:XMLHttpRequest
Form Dataview sourceview URL encoded
undefined:
undefined:
---------------------------------------------------
注意看红色字体部分,两个undefined!
这因为默认的ajax content-type 是application/x-www-form-urlencoded
它要尝试解析为 key=value&key=value 这种形式提交的。
正确的ajax应该写为:
$(function () {
$("#btnTest").click(function () {
$.ajax({
url: "api/values",
type: "POST",
dataType: "json",
contentType: "application/json",
//processData: false,
data: JSON.stringify([{ "A": "a", "B": "b" }, { "A": "a1", "B": "b1" }]),
success: function (data) {
alert(JSON.stringify(data));
},
error: function (data) {
alert(JSON.stringify(data));
}
});
});
});
查看请求原始内容:
---------------------------------------------------
Request URL:http://localhost:6583/api/values
Request Method:POST
Status Code:200 OK
Request Headersview source
Accept:application/json, text/javascript, */*; q=0.01
Accept-Charset:GBK,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:zh-CN,zh;q=0.8
Connection:keep-alive
Content-Length:39
Content-Type:application/json
Host:localhost:6583
Origin:http://localhost:6583
Referer:http://localhost:6583/
User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.17 (KHTML, like Gecko) Chrome/24.0.1312.57 Safari/537.17
X-Requested-With:XMLHttpRequest
Request Payload
[{"A":"a","B":"b"},{"A":"a1","B":"b1"}]
---------------------------------------------------
因此要修改:
1. content-type=application/json
2. data 赋予string的json内容
[解决办法]
这样就行了
[HttpPost]
public void SetTestMethod(IEnumerable<TestC> value)
{
}