JSON数据交互

在web开发中，前端常经过ajax提交json数据与后台交互
在使用JSON进行数据交互时，须要先导入jackson-databind包(maven会自动导入它的基础包jackson-core核心包和jackson-annotation注解包，而且注解包须要在SpringMVC中添加<mvc:annotation-driven />)
推荐在实际项目开发中99%(剩下的1%建议作好删库跑路准备)使用JSON对象传数据，由于对数据复杂状况下JSON串使用并不方便
JSON串不能取属性，强行取属性只会获得undefined

JSON串传输

前端

// 例用ajax提交表单数据
    $('#myAjax').on('click',function(){
        $.ajax({
            type:"POST",
            url:"testAjax",
            data:{ 
                shopName:"myShop",
                shopDesc:"myDesc"
            },
            contentType:"application/x-www-form-urlencoded",// 默认类型，能够不写
            dataType:"text",
            success:function(result){
                alert(result);
            },
            error:function(d,m){
                alert(m);
            }
        });
    });

后端

@RequestMapping(value = "/testAjax", method = RequestMethod.POST)
    @ResponseBody
    public Object my(Shop shop) {
        System.out.println(shop);
        return shop;
    }

• application/x-www-form-urlencoded表示以key1=val1&key2=val2形式(即标准URL模式)传输数据，JSON对象会在网络传输中自动转换成这种格式(这里data:必须是JSON对象不能是JSON串)，传输到后台的数据会自动适配成相应实体类(要求属性一一对应)，x-www-form-urlencoded也是contentType的默认类型
• @ResponseBody表示返回JSON对象
• dataType:text表示以JSON.stringify(Object)形式解析返回的JSON对象为JSON串(JSON字符串)

JSON对象转输

前端

$('#myAjax').on('click',function(){
        $.ajax({
            type:"POST",
            url:"testAjax",
            data:JSON.stringify({ shopName:"myShop",shopDesc:"myDesc"}),
            contentType:"application/json",
            dataType:"json",// dataType默认类型为json
            success:function(result){
                alert(JSON.stringify(result));
            },
            error:function(d,m){
                alert(m);
            }
        });
    });

后端

@RequestMapping(value = "/testAjax", method = RequestMethod.POST,consumes = "application/json")
    @ResponseBody
    public Shop my(@RequestBody Shop shop) {
        System.out.println(shop);
        return shop;
    }

需设置

...
data:JSON.stringify(jsonData),
contentType:"application/json",
...

后端的参数须要注解@RequestBody以绑定实体类
consumes = "application/json"指定以JSON对象的方式解析网络传输过程当中的JSON串，功能等同于contentType:"application/json"
由于已经指定了dataType:"json"，因此需JSON.stringify()解析返回JSON对象，或者继续指定后端返回前台数据类型dataType:"text"，否则直接输出会获得[Object object]结果
(对于JSON对象，能够用JSON.data访问相应数据)

JSON对象数组传输

前端

$('#myAjax').on('click',function(){
        var shop1 = { shopName:"myShop",shopDesc:"myDesc"}; 
        var shop2 = { shopName:"myShop2",shopDesc:"myDesc2"}; 
        $.ajax({
            type:"POST",
            url:"testAjax",
            data:JSON.stringify([shop1,shop2]),
            contentType:"application/json",
            dataType:"json",
            success:function(result){
                alert(JSON.stringify(result);// 如果用typeof()可知这里是Object
            },
            error:function(d,m){
                alert(m);
            }
        });
    });

后端

@RequestMapping(value = "/testAjax", method = RequestMethod.POST,consumes = "application/json")
    @ResponseBody
    public Object my(@RequestBody Shop[] shop) {
        System.out.println(Arrays.toString(shop));
        return shop;
    }

基本没什么特别的注意使用JSON.stringify([shop1,shop2])将JSON对象数组转为JSON串，在以contentType:"application/json"以JSON对象格式传输便可(即标准的{key:value,key2:value2}格式，如果x-www-urlencoded则是key=value&key2=value2格式传输)

预备知识

contentType类型
https://www.cnblogs.com/shiha...
dataType类型

类型	做用
json	jquery以JSON.parse()形式解析JSON串(网络传输)为js对象
text	显示后台返回的JSON串
html	显示后台返回的JSON串

在http中传输数据时，需遵循TCP/IP协议，规范以下：

<method><request-url><version>
<headers>
<entity-body></entity-body>
</headers>
</version></request-url></method>