现在在做的项目用到了SpringMVC框架,需要从前端angular接收请求的JSON数据,为了测试方便,所以直接先用AJAX进行测试,不过刚开始用平时用的ajax方法,提交请求会出现415或者400错误,经过研究,终于可以了,现在做个总结。
js代码:
-
function postSimpleData() {
-
$.ajax({
-
type:
"POST",
-
url:
"Service/SimpleData",
-
contentType:
"application/json",
//必须有
-
dataType:
"json",
//表示返回值类型,不必须
-
data:
JSON.stringify({
'foo':
'foovalue',
'bar':
'barvalue' }),
//相当于 //data: "{'str1':'foovalue', 'str2':'barvalue'}",
-
success:
function (jsonResult) {
-
alert(jsonResult);
-
}
-
});
-
}
-
function login(){
-
$.ajax({
-
url:
"Service/login",
-
type:
"POST",
-
contentType:
"application/json",
-
dataType:
"json",
-
data:
JSON.stringify({
-
MachineIP:
"127.0.0.1",
-
AppTag:
"4",
-
RequestInfo:{
-
StaffCode:
"",
-
Password:
"",
-
StaffCard:
"01411"
-
},
-
}),
-
async:
true,
-
success:
function(data) {
-
var ss =
JSON.stringify(data);
-
$(
"#result").val(ss);
-
console.log(ss);
-
}
-
});
-
}
-
function postEmployees() {
-
$.ajax({
-
type:
"POST",
-
url:
"Service/Employees",
-
contentType:
"application/json",
-
dataType:
"json",
-
data:
JSON.stringify({
"Employees": [
-
{
"firstName":
"Bill",
"lastName":
"Gates" },
-
{
"firstName":
"George",
"lastName":
"Bush" },
-
{
"firstName":
"Thomas",
"lastName":
"Carter" }
-
]
-
-
}),
-
success:
function (jsonResult) {
-
alert(jsonResult);
-
}
-
});
-
}
JAVA Controller代码:
-
@RequestMapping(value =
"/SimpleData", method = RequestMethod.POST)
-
@ResponseBody
-
public ActionResult SimpleData(string foo, string bar) {
-
return Json(
"SimpleData", JsonRequestBehavior.AllowGet);
-
}
-
-
@RequestMapping(value =
"/login", method = RequestMethod.POST)
-
@ResponseBody
-
public ResponseProtocolMap login(@RequestBody JSONObject requestJson, HttpServletRequest request) {
-
ResponseProtocolMap responseProtocolMap =
null;
-
String machineIP = RequestJsonUtils.getMachineIP(requestJson);
-
String appTag = RequestJsonUtils.getAppTag(requestJson);
-
JSONObject requestInfo = RequestJsonUtils.getRequestInfo(requestJson);
-
if (requestInfo ==
null) {
-
responseProtocolMap =
new ResponseProtocolMap(
"-1",
"参数错误");
-
}
else {
-
String staffCode = RequestJsonUtils.getValueByKey(requestInfo,
"StaffCode");
-
String password = RequestJsonUtils.getValueByKey(requestInfo,
"Password");
-
String staffCard = RequestJsonUtils.getValueByKey(requestInfo,
"StaffCard");
-
responseProtocolMap = sysLoginService.login(staffCode, password, staffCard, appTag, request);
-
}
-
return responseProtocolMap;
-
}
-
-
@RequestMapping(value =
"/Employees", method = RequestMethod.POST)
-
@ResponseBody
-
public ActionResult Employees(List<Employee> Employees) {
-
return Json(
"Employees", JsonRequestBehavior.AllowGet);
-
}
-
public
class Employee{
-
public string FirstName { get; set; }
-
public string LastName { get; set; }
-
}
值得注意的有2点:
1)Ajax 选项中
contentType: "application/json"
这一条必须写,表明request的数据类型是json。
而
dataType: "json"
这一条表示返回值的类型,不是必须的,且依据返回值类型而定。
2)选项中
data: JSON.stringify({ 'foo': 'foovalue', 'bar': 'barvalue' })
很多时候我们将数据写作:
{ 'foo': 'foovalue', 'bar': 'barvalue' }
这样会导致错误,因为js会默认将这个json对象放到表单数据中,故而导致controller接收不到。
有两种办法处理:第一种方式是用JSON.stringify()函数,其中JSON被Ecmascript5定义为全局对象。
第二种方式是直接用双引号包裹起来,比如data: "{'str1':'foovalue', 'str2':'barvalue'}"。