$.ajax方法之contentType使用

平时没注意,今天在项目使用时,$.ajax请求设置了contentType : "application/json",后台收不到data的内容数据,折腾了一小会,现总结下用法。

说明

contentType: 发送信息至服务器时内容编码类型,或简单理解为发送的数据的格式,指的是属性data的内容格式。
注意并强调:contentType 设置的数据格式对应的data的类型必须是字符串类型,指的是该字符串内容是以contentType设置的数据格式组装的。
默认是:application/x-www-form-urlencoded; charset=UTF-8,可通过浏览器的F12查看请求头中该类型参数的值。

传JSON对象

  1. JS代码,data 数据是原始的key/value形式传的是json对象,后台会自动将 json 对象绑定到到方法属性里面(属性名相同)。

  2. 传的data数据是json对象,则不能设置contentType:'application/json; charset=UTF-8',否则后台会接收不到数据。contentType的数据格式对应的data数据类型必须是字符串型。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    function ajaxRequest() {
    var user = {
    realName: '李四',
    account: 'admin',
    password: '112233',
    };
    $.ajax({
    type : 'post',
    url : '/user/ajaxUser',
    dataType : 'json',
    data : user,
    success : function(data, textStatus) {
    console.log(data);
    }
    });
    }
  3. SpringMVC会自动将请求的内容数据绑定到方法属性(属性相同的)。
    属性不能使用@RequestBody注解,该注解处理的是json字符串数据,使用了会接收不到json对象数据。

1
2
3
4
5
6
@RequestMapping(value = "/ajaxUser")
@ResponseBody
public User returnUser(User user) {
user.setAge(22);
return user;
}

传JSON字符串

当请求的内容数据(json对象)较为复杂时,如:json 里面值也是个json,再里面的值可能是可数组,数组里面又是一个json,若出现这种比较特殊的数据,则默认的application/x-www-form-urlencoded是无法将复杂的 json 组织成键值对形式的,后台无法收到请求的数据。

此时可以将 json对象转换为字符串,通过设置contentType指定为 json 数据格式,后台的处理方法在方法参数里添加@RequestBody注解,就可以将 json字符串自动绑定到方法属性里面了。

  1. JS代码,使用 JSON.stringify(obj) 方法将 json对象转换为字符串。

  2. 设置contentType : 'application/json; charset=UTF-8',指定字符串数据格式为json

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    function ajaxRequest() {
    var user = JSON.stringify({
    realName: '李四',
    account: 'admin',
    password: '112233',
    });
    $.ajax({
    type : 'post',
    url : '/user/ajaxUser',
    dataType : 'json',
    contentType: 'application/json; charset=UTF-8',
    data : user,
    success : function(data, textStatus) {
    console.log(data);
    }
    });
    }
  3. 方法属性里添加@RequestBody 注解,可将接收到的json字符串绑定到属性对象或形参中。

    1
    2
    3
    4
    5
    6
    7
    @RequestMapping(value = "/ajaxUser")
    @ResponseBody
    public User returnUser(@RequestBody User user) {
    user.setAge(22);
    return user;

    }
作者

光星

发布于

2018-01-13

更新于

2022-07-07

许可协议

评论