700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 通过Ajax进行POST提交JSON类型的数据到SpringMVC Controller的方法

通过Ajax进行POST提交JSON类型的数据到SpringMVC Controller的方法

时间:2022-02-09 16:19:38

相关推荐

通过Ajax进行POST提交JSON类型的数据到SpringMVC Controller的方法

现在在做的项目用到了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);}});}

JAVAController代码:

@RequestMapping(value = "/SimpleData", method = RequestMethod.POST)@ResponseBodypublic ActionResult SimpleData(string foo, string bar) {return Json("SimpleData", JsonRequestBehavior.AllowGet);}@RequestMapping(value = "/login", method = RequestMethod.POST)@ResponseBodypublic 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)@ResponseBodypublic 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'}"。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。