• 搭建SSM框架SpringMVC之JSON传数据


    json格式的字符串(传递数据的一种载体)
    json格式字符串 <----> js对象
      js中的JSON类型
        JSON.stringify(obj);
        JSON.parse(str);
    json格式字符串 <----> java对象
      使用第三方jar来完成即可

    例子:

      ajex请求给服务器发送JSON格式字符串,服务器接受,利用第三方jar把JSON格式字符串转换成对象,然后返回JSON格式字符串,js接受,jQuery自动把它转换成js对象
    拿到的都是对象,但传输的都是字符串(JSON格式)

     测试页面1(json1.jsp):

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <%
        String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
    %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <base href="<%=basePath %>" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>json1.jsp</title>
    <script type="text/javascript">
        
        //js对象
        var obj = {id:1,name:"tom1",age:21};
        console.log(obj);
        console.log(obj.id);
        console.log(obj.name);
        console.log(obj.age);
        
        //json格式的字符串
        var jsonStr = JSON.stringify(obj);
        //把js对象转为json格式字符串
        //{"id":1,"name":"tom1","age":21}
        console.log(jsonStr);
        
        console.log("---------------------------");
        
        //json格式字符串
        jsonStr = '{"id":2,"name":"tom2","age":22}';
        console.log(jsonStr);
        
        //json格式字符串转换为js对象
        obj = JSON.parse(jsonStr);
        console.log(obj);
    
    </script>
    </head>
    <body>
        <h1>json1.jsp</h1>
        <hr>
        
        
        
    
    </body>
    </html>

    测试页面2(json2.jsp):

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <%
        String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
    %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <base href="<%=basePath %>" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>json2.jsp</title>
    <script type="text/javascript" src="static/js/jquery/jquery-1.8.3.min.js"></script>
    
    <script type="text/javascript">
        
        $(function(){
            
            $("#btn1").on("click",function(){
                
                var obj = {id:1,name:"tom",age:20};
                var jsonStr = JSON.stringify(obj);
                
                /*
                    contentType属性表示本次请求给服务器发送的数据类型是什么
                        对应了之前请求头中的属性:Content-Type
                    dataType属性表示本次请求希望服务器返回的数据类型是什么
                        对应了之前请求头中的属性:Accept
                */
                
                
                $.ajax({
                    type: "POST",
                    url: "request_body/test2",
                    contentType: "application/json",
                    data: jsonStr,
                    dataType: "text",
                    success: function(msg){
                        console.log(msg);
                    }
                });
                
            });
            
            
            
            $("#btn2").on("click",function(){
                var obj = {id:1,name:"tom",age:20};
                var jsonStr = JSON.stringify(obj);
                
                
                /*
                contentType属性表示本次请求给服务器发送的数据类型是什么
                    对应了之前请求头中的属性:Content-Type
                dataType属性表示本次请求希望服务器返回的数据类型是什么
                    对应了之前请求头中的属性:Accept
                */
                $.ajax({
                    type: "POST",
                    url: "request_body/test3",
                    contentType: "application/json",
                    data: jsonStr,
                    dataType: "json",
                    success: function(obj){
                        //jquery会把json格式字符串自动转为js对象
                        console.log(obj);
                        console.log(obj.msg);
                    }
                });
                
            });
            
            
            
            $("#btn4").on("click",function(){
                var obj = {id:1,name:"tom",age:20};
                var jsonStr = JSON.stringify(obj);
                
                
                /*
                contentType属性表示本次请求给服务器发送的数据类型是什么
                    对应了之前请求头中的属性:Content-Type
                dataType属性表示本次请求希望服务器返回的数据类型是什么
                    对应了之前请求头中的属性:Accept
                */
                $.ajax({
                    type: "POST",
                    url: "request_body/test4",
                    contentType: "application/json",
                    data: jsonStr,
                    dataType: "json",
                    success: function(obj){
                        //jquery会把json格式字符串自动转为js对象
                        console.log(obj);
                        console.log(obj.msg);
                    }
                });
                
            });
            
            
            $("#btn5").on("click",function(){
                var obj = {id:1,name:"tom",age:20};
                var jsonStr = JSON.stringify(obj);
                
                
                /*
                contentType属性表示本次请求给服务器发送的数据类型是什么
                    对应了之前请求头中的属性:Content-Type
                dataType属性表示本次请求希望服务器返回的数据类型是什么
                    对应了之前请求头中的属性:Accept
                */
                $.ajax({
                    type: "POST",
                    url: "request_body/test5",
                    contentType: "application/json",
                    data: jsonStr,
                    dataType: "json",
                    success: function(obj){
                        //jquery会把json格式字符串自动转为js对象
                        console.log(obj);
                        console.log(obj.id);
                        console.log(obj.name);
                        console.log(obj.age);
                        console.log(obj.dob);
                    }
                });
                
            });
            
            
        });
        
    </script>
    </head>
    <body>
        <h1>json2.jsp</h1>
        <hr>
        
        <input id="btn1" type="button" value="按钮1">
        <input id="btn2" type="button" value="按钮2">
        <input id="btn4" type="button" value="按钮4">
        <input id="btn5" type="button" value="按钮5">
        
    
    </body>
    </html>

    后台的控制类:

    package com.briup.web.annotation;
    
    import java.io.Writer;
    
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.RequestBody;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.ResponseBody;
    
    import com.briup.bean.User;
    
    @RequestMapping("/request_body")
    @Controller
    public class RequestBodyController {
        
        /*
         * @RequestBody注解的使用
         * 作用:获得请求体中的内容
         */
        
        
        @RequestMapping("/test1")
        public String test1(@RequestBody String str)throws Exception{
            System.out.println("RequestBodyController test1..");
            
            //id=1&name=tom&age=20
            System.out.println("str = "+str);
            
            return "test";
        }
        
        
        //@RequestBody注解一般结合ajax,然后以json格式字符串进行传值
        //因为正常情况下,使用@RequestBody注解获得了表单中的值:id=1&name=tom&age=20
        //这个值id=1&name=tom&age=20,我们获取后作用不大
        //但是如果从请求体中获得一个json格式的字符串,那就不一样了
        //因为可以容易的把json格式字符串转换为java的对象
        //需要引入第三方jar包,才可以把json字符串转为java对象
        @RequestMapping("/test2")
        public void test2(@RequestBody User u,Writer out)throws Exception{
            System.out.println("RequestBodyController test2..");
            
            System.out.println("u = "+u);
            
            out.write("hello");
            out.flush();
            
        }
        
        
        //给ajax请求返回json格式的字符串
        @RequestMapping("/test3")
        public void test3(@RequestBody User u,Writer out)throws Exception{
            System.out.println("RequestBodyController test3..");
            
            System.out.println("u = "+u);
            
            String jsonStr = "{"msg":"hello world"}";
            
            out.write(jsonStr);
            
            out.flush();
            
        }
        
        
        //@ResponseBody表示把方法的返回值放到响应体中
        @ResponseBody
        @RequestMapping("/test4")
        public String test4(@RequestBody User u)throws Exception{
            System.out.println("RequestBodyController test4..");
            
            System.out.println("u = "+u);
            
            String jsonStr = "{"msg":"hello world"}";
            
            return jsonStr;
        }
        
        @ResponseBody
        @RequestMapping("/test5")
        public User test5(@RequestBody User u)throws Exception{
            System.out.println("RequestBodyController test5..");
            
            System.out.println("u = "+u);
            
            //对象会被自动转为json格式字符串
            User user = new User(2L,"tom2",32);
            
            return user;
        }
        
        
    }

    总结:

    @RequestBody注解
    可以接收客户端ajax请求中的json数据并且转换为对象,但是只能接收post请求中的数据,因为post请求的数据在请求体中(request-body).
    需要引入操作json的相关jar包:
      jackson-core-2.8.5.jar
      jackson-annotations-2.8.5.jar
      jackson-databind-2.8.5.jar
    或者
      jackson-mapper-asl-1.9.13.jar
      jackson-core-asl-1.9.13.jar

    客户端使用ajax发送json数据给Controller,Controller里面接收json数据并且转换为对象
    1.ajax请求发送的时候要指定为post方式
    2.ajax请求发送的时候要指定contentType:"application/json"
    3.ajax请求发送的时候要把json对象转换为字符串再发送
    4.Controller中要使用@RequestBody指定接收数据的参数
    5.项目中要引入json相关的jar包
    6.如果此ajax请求还希望Controller返回的数据也是json格式的,那么需要在发送ajax请求的时候指定dataType:"json",
    7.Controller中的方法要返回json格式的数据给客户端,可以使用@ResponseBody标签 或者 在方法中自己使用response对象获得io流给客户端写回去

    注意:
    ajax发送请求的时候,请求头中的Content-Type默认值是: application/x-www-form-urlencoded,表示当前请求中如果有数据的话,将会是key=value&key=value的形式

    注意:在javascript中,json对象和字符串之间的转换:
      JSON.stringify(obj)将JSON对象转为字符串。
      JSON.parse(string) 将字符串转为JSON对象;

  • 相关阅读:
    从服务器上下载下来的代码,部署到本地时,Url自动带www前缀
    个人说明
    名词解释
    Bandizip-解压缩软件
    uTools-工具插件集
    Geek-软件卸载工具
    Microsoft商店软件推荐
    Docker入门第九章
    Docker入门第八章
    IDM-下载工具
  • 原文地址:https://www.cnblogs.com/wsyblog/p/8227838.html
Copyright © 2020-2023  润新知