springmvc与ajax的交互在实际开发中十分常见,以下是对springmvc与ajax交互时参数的传递与接收做的一些整理
jsp页面:
<form id="login" style="width:600px; border:1px solid #000;border-left:none;border-right:none">
<p align="center">账号:<input type="text" id="username" /></p>
<p align="center">密码:<input type="password" id="password" /></p>
<p align="center"><input type="submit" id="submit" value="登录" /></p>
</form>在这里插入代码片
一、ajax请求如下:contentType:application/x-www-form-urlencoded
发送的数据格式为“A=xxx&B=xxx”data数据不是json对象
$(function(){
$("#submit").click(function(){
$.ajax({
type: "POST",
//contentType : 'application/x-www-form-urlencoded',//默认类型
url: '${pageContext.request.contextPath}/databind/json',
dataType: "json",
data: {username:$('#username').val(),
password:$('#password').val()},
success: function(data){
alert('username : '+data.username+'\npassword : '+data.password);
}
});
});
});
由于contentType : ‘application/x-www-form-urlencoded’,最终参数是以username=admin&password=123456这个格式传至后台,当然你也可以利用占位符直接传字符串过去(后台使用@PathVariable注解逐个接收),但是,如果项目中字段还是特别多的,这样拼接会相当繁琐,然而我们知道还有个方法供我们使用,jQuery给我们提供的**$(“#login”).serialize()序列化表单**。
$(function(){
$("#submit").click(function(){
var params = $("#login").serialize();//序列化表单
alert(params);
$.ajax({
type: "POST",
url: '${pageContext.request.contextPath}/databind/json',
dataType: "json",
data: params,
success: function(data){
alert('username : '+data.username+'\npassword : '+data.password);
}
});
});
});
后台springmvc接收参数方式如下:
1.直接使用参数名接收:无需注解
参数较少的情况可以使用
@RequestMapping(value="json", method = {RequestMethod.POST})
@ResponseBody
public Account json(String username,String password){
Account account = new Account();
account.setUsername(username);
account.setPassword(password);
return account;
}
2.使用pojo对象接收:无需注解
参数较多的情况下,使用对象一次性接收多个参数,简单快捷;
使用pojo对象接受参数不需要@RequestParam注解前缀,只需将实体中的属性名与参数名一一对应即可,因为该注解是通过指定的参数名获取请求中的参数,而pojo对象并不是请求中的参数名,只是用来封装参数的容器;
@RequestMapping(value="/json", method = {RequestMethod.POST})
@ResponseBody
public Account json(Account account){
System.out.println(account);
return account;
}
3.使用@RequestParam注解接收:
每个@RequestParam注解只能获取对应的一个参数,请求的参数和接受参数必须同名,否则无法接受;
前面我们已经看到了,接受单个基本类型值的参数,只要在方法中分别写下对应的参数名,并不需要使用什么注解就能拿到传过来的值,那为什么还有@RequestParam这个注解呢,并且看到很多地方都在用。
其实呢这个注解,有它的用处,并不是一无是处,首先作为基本类型的参数,如果不使用注解,是可传可不传的,如果为null并不会报错,但当你使用了@RequestParam注解,那么此时该参数就是必传的了,如果不传就会报错,然而还是可以通过配置来让其可不必传,如@RequestParam(value=”username”, required=false),此外,该注解还可以设置如果前台没有传值过来,会给一个默认值,如@RequestParam(value=”username”, defaultValue=”ruo”)。
我对该注解做的总结是:如果你某个参数不是必传的,就别用它了,如果是必传的,请一定用上它,如果必传参数可以有默认值的话,还请加上defaultValue默认值;
@RequestMapping(value="json", method = {RequestMethod.POST})
@ResponseBody
public Account json(@RequestParam(value = "username")String username,
@RequestParam(value = "password")String password){
Account account = new Account();
account.setUsername(username);
account.setPassword(password);
return account;
}
二、ajax请求如下:contentType : 'application/json’
注意:若设置contentType : ‘application/json’发起请求,data必须将JavaScript对象转换成json字符串,否则后台接收不到参数,导致报错。
$(function() {
$("#submit1").click(function() {
var json = {
'username':$(':input[name=username]').val(),
'password':$(':input[name=password]').val()
};
var postdata = JSON.stringify(json);//JavaScript对象转换json字符串
alert(postdata);
$.ajax({
type : 'POST',
contentType : 'application/json',//json类型
/**
*(默认: true) 默认情况下,通过data选项传递进来的数据,如果是一个对象(技术上讲只要不是字符串),
* 都会处理转化成一个查询字符串,以配合默认内容类型 "application/x-www-form-urlencoded"。
* 如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。
*/
processData : false,
url : '${pageContext.request.contextPath}/databind/json',
dataType : 'json',
data : postdata,
success : function(data) {
alert('username : '+data.username+'\npassword : '+data.password);
},
error : function() {
alert('error...');
}
});
});
});
后台springmvc接收参数方式如下:
1.使用@RequestBody接收:
@RequestBody用于把接收到的JSON、xml数据转化为Pojo对象接收
@RequestMapping(value="json", method = {RequestMethod.POST})
@ResponseBody
public Account requestBodyBind(@RequestBody Account account){
System.out.println("requestbodybind:" + account);
return account;
}
反例:contentType : ‘application/json’发起的请求,我们能不能用如下的方式接收值呢
@RequestMapping(value="json", method = {RequestMethod.POST})
@ResponseBody
public Account json(String username, String password){
Account account = new Account();
account.setUsername(username);
account.setPassword(password);
return account;
}
答案是不可以的,会抛异常,400 Bad Request
究其原因是:contentType : ‘application/json’数据发送后台接收必须是Modle,不能是单个属性,且必须加上@RequestBody注解。