Springmvc返回json数据

Springmvc返回json数据

数据存储方式?

变量,数组,对象,集合,文件,xml,数据库{oracle,mysql, redis}

数据传输方式?xml,json  ECMAScript: javascript

Json:是一种轻量级的数据交换格式。它基于ECMAScript (w3c制定的js规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据.

{"firstName": "John"}

这很容易理解,等价于这条 JavaScript 语句:

{firstName = "John"}

浏览器:利用json 将某些轻量的数据存储在本地。

要想将数据转换为json,必须要先导入jar,然后在@RequestMapping()后加@ResponseBody

案例驱动:当list.jsp一运行的时候,就要去加载所有的数据!

使用的技术:jquery,Ajax。

List.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<!-- 引入js文件 -->

<script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery.min.js"></script>

<script type="text/javascript">

    /* 当页面加载的时候就运行js */

    $(function(){

         $.ajax({

            type:"post",

            url:"/06springmvc/listUser",

            dataType:"json",

            success:function(data){

                /* 循环data中数据并添加到table */

                for(var i = 0;i<data.length;i++){

                    //一行数据

                    var content = "<tr><td>"+data[i].id+"</td><td>"+data[i].name+"</td><td>"+data[i].pwd+"</td></tr>"

                    //将循环出来的每一行数据添加到table

                    $("#tab").append(content);

                }

            }

        })

    })

</script>

<title>查询所有数据</title>

</head>

<body>

    <table id="tab" >

        <tr>

            <th>ID</th>

            <th>NAME</th>

            <th>PWD</th>

        </tr>

        <tr>   

            <td>${info.id }</td>

            <td></td>

            <td></td>

        </tr>

       

    </table>

</body>

</html>

Controller

@RequestMapping("listUser")

    @ResponseBody

    public List<User> findAll(){

       //  利用集合模拟一个数据库

       List<User> list = new ArrayList<>();

       list.add(new User(1, "高圆圆", "666"));

       list.add(new User(2, "唐嫣", "666"));

       list.add(new User(3, "志林", "666"));

       list.add(new User(4, "宋慧乔", "666"));

       list.add(new User(5, "陈乔恩", "666"));

       list.add(new User(6, "金星", "666"));

       list.add(new User(7, "刘德华", "666"));

       list.add(new User(8, "梁朝伟", "666"));

       list.add(new User(9, "郭富城", "666"));

       list.add(new User(10, "宋喆", "666"));

       list.add(new User(11, "王宝强", "666"));

       System.out.println(list);

       //  将集合数据转化为json格式 

       return list;

    }

使用gson和使用jackson两个jar包都可以转换json数据,不同的是!

Gson要返回的一个字符串!

Jackson:返回的一个对象或者集合

案例驱动:登录成功之后,显示查询数据页面!

<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Insert title here</title>

<script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery.min.js"></script>

<script type="text/javascript">

    $(function(){

        /* 点击login的时候进行异步提交 */

        $("#log").click(function(){

            var name = $("#tname").val();

            var pwd = $("#tpwd").val();

            $.ajax({

                type:"post",

                url:"/06springmvc/loginAjax",

                data:{"name":name,"pwd":pwd},

                dataType:"json",

                success:function(data){

                    if(data.flg=="ok"){

                        alert("登录成功!")

                        /* 页面跳转 */

                        location.href="/06springmvc/list.jsp";

                    }else{

                        alert("登录失败!")

                    }

                }

            })

        })

    })

</script>

</head>

<body>

        <input type="text" name="name" id="tname"/><br>

        <input type="password" name="pwd" id="tpwd"/><br>

        <input type="submit" id="log" value="login"/><br>

</body>

</html>

Controller

@RequestMapping("loginAjax")

    @ResponseBody

    public String loginAjax(User user) {

        // 通过一个表示来判断登录是否成功!

        // 可以通过map集合来判断

        Map map = new HashMap<>();

        System.out.println(user);

        if ("admin".equals(user.getName())) {

            map.put("flg", "ok");

        } else {

            map.put("flg", "ng");

        }

        // map返回给前台页面。list转换jsonmap 可以不

        // 创建Gson对象

        Gson gson = new Gson();

        String json = gson.toJson(map);

        return json;

    }

 

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值