响应json数据之响应json格式数据

1.在response.jsp编写如下代码：

<%--
  Created by IntelliJ IDEA.
  User: Adair
  Date: 2020/7/2 0002
  Time: 10:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>返回响应</title>
    <script src="js/jquery.min.js"></script>
    <script>
        // 页面加载，绑定单击事件
        $(function(){
    
    
            $("#btn").click(function(){
    
    
                // alert("hello btn");
                // 发送ajax请求
                $.ajax({
    
    
                    // 编写json格式，设置属性和值
                    url:"user/testAjax",
                    contentType:"application/json;charset=UTF-8",
                    data:'{"username":"Adair","password":"123456","age":25}',
                    dataType:"json",
                    type:"post",
                    success:function(data){
    
    
                        // data服务器端响应的json的数据，进行解析
                        alert(data);
                        alert(data.username);
                        alert(data.password);
                        alert(data.age);
                    }
                });
            });
        });
    </script>
</head>
<body>
        <button id="btn">发送ajax的请求</button>
</body>
</html>

2.创建返回响应控制器类控制器类的代码如下：

package com.txw.controller;

import com.txw.domain.User;
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;
/**
 * 返回响应控制器类
 * @author Adair
 */
@Controller
@RequestMapping(value = "/user")
@SuppressWarnings("all")        // 注解警告信息
public class UserController {
    
    
    /**
     * 模拟异步请求响应
     */
    @RequestMapping("/testAjax")
    public @ResponseBody User testAjax(@RequestBody User user){
    
    
        System.out.println("testAjax方法执行了...");
        // 客户端发送ajax的请求，传的是json字符串，后端把json字符串封装到user对象中
        System.out.println(user);
        // 做响应，模拟查询数据库
        user.setUsername("Adair");
        user.setAge(24);
        // 做响应
        return user;
    }
}

3.使用TomCat运行结果如图：
在这里插入图片描述
4.通过浏览器访问http://localhost:8080/response.jsp结果如图所示：
5.点击“发送ajax的请求”的按钮会跳转到如图所示的界面：
6.控制台打印结果如图所示：

7.需要的用户的实体类的代码如下：

package com.txw.domain;

import lombok.Data;
import lombok.ToString;
import java.io.Serializable;
/**
 * 用户实体类
 * @author Adair
 */
@Data        // 自动生成set和get方法
@ToString   // 重写toString方法
@SuppressWarnings("all")        // 注解警告信息
public class User implements Serializable {
    
    
    private String username;       // 用户名
    private String password;      // 密码
    private Integer age;          // 年龄
}

响应json数据之响应json格式数据

响应json数据之响应json格式数据

猜你喜欢