JavaWeb阶段（Ajax和Json的详情介绍）

Ajax

ajax是一种异步刷新技术，用来在当前页面内响应不同的请求内容。
ajax是一种无需重新加载整个网页，能够更新部分网页的技术。

同步与异步

1. 同步就是客户端必须等待服务器的请求，在等请求的期间不能做其他操作。
2. 异步不需要等待服务器的响应，在服务器处理请求的过程中。客户端可以进行其他的操作。

实现ajax发送请求

jquery方式

$.ajax()

1.语法

$.ajax({
	键名:值，
	。。。
	。。。
	键名:值
});

2. 相关属性

| url | 请求路径 |
|type|请求方式|
| data | 请求数据{“username”:“jack”,“age”:“12”} |
| success | 相映成功 |
|error|响应错误，需要定义回调函数|
|dataType|设置接收到的响应数据的格式|

3. 实例

<input type="button" value="发送请求" onclick="send_ajax()">

<script>
    function send_ajax() {
        $.ajax({
            url:"/js_ajaxServlet",
            type:"GET",
            data:{"username":"tom"},
            success:function (data) {
                alert(data);
            },
            error:function () {
                alert("出错了！");
            },
            dataType:"text"
        })
    }
</script>

/**
 * @author lifly
 * @date 2021/6/20 0020 9:49
 */
@WebServlet("/js_ajaxServlet")
public class Jq_AjaxServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        String username = request.getParameter("username");
        response.getWriter().write(username);
    }

$.get()

1. 语法

$.get(url,[data],[callback],[type])

2. 相关属性

url:请求路径
data:请求参数{“username”:“rose”,“age”:12}
callback:回调函数
type:响应结果的类型

3. 实例

<input type="button" value="发送请求" onclick="send_ajax()">
<script>
    function send_ajax() {
        $.get("/jq_ajax_GetServlet",{"username":"lisi","age":14},function(data){
            alert(data);
        },"text")
    }
</script>

/**
 * @author lifly
 * @date 2021/6/20 0020 10:13
 */
@WebServlet("/jq_GetServlet")
public class Jq_GetServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        String username = request.getParameter("username");
        String age = request.getParameter("age");
        response.getWriter().write(username+age);
    }

$.post()

1. 语法

$.post(url,[data],[callback],[type])

2. 相关属性

url:请求路径
data:请求参数{“username”:“tom”,“age”:14}
callback:回调函数
type:响应结果的类型

3. 实例

<input type="button" value="发送请求" onclick="send_ajax()">
<script>
    function send_ajax() {
        $.post("/jq_PostServlet",{"username":"wangwu","age":15},function(data){
            alert(data);
        },"text")
    }
</script>

/**
 * @author lifly
 * @date 2021/6/20 0020 10:28
 */
@WebServlet("/jq_PostServlet")
public class Jq_PostServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        String username = request.getParameter("username");
        String age = request.getParameter("age");
        response.getWriter().write(username+age);
    }

JSON

JavaScript Object Notation JavaScript对象表示法
json现在多用于存储和交换文本信息的语法
进行数据的传输
JSON比XML更小，更快，更易解析

基础语法

json数据由键值对构成，K:V形式
键用引号（单双都性）引起来，例如:“username”:“jack”
值得取值类型有：数字，字符串，逻辑值，数组，对象，null
数据由逗号分隔，多个键值有逗号分开
“username”:“tom”,"age:12
花括号保存对象：使用{}定义json格式
{“username”:“rose”;‘age’:14}
方括号保存数组：[]
[“jack”,“rose”,“tom”,“jane”…]

解析JSON数据

解析对象

<script>
    //定义对象
    let person = {"username":"jack",
                  "password":"123",
                  "address":"郑州"};
    //解析数据：for in遍历person对象
    for (let key in person) {
        let value = person[key];
        alert(key+":"+value);
    }
</script>

解析数组

<script>
    //定义数组
    let persons = [
        {"username":"jack", "password":"123", "address":"北极"},
        {"username":"rose", "password":"123", "address":"南极"},
        {"username":"tom", "password":"1234", "address":"中极"},
        ];
    //解析数据：使用for of遍历person数组
    for (let person of persons) {
        //获取每一个person对象，遍历每个person里的数据
        for (let key in person) {
            let value = person[key];
            console.log(key+":"+value);
        }
    }
</script>

解析K对应数组对象

<script>
    var obj = {
        "persons": [
            {"name": "张三1", "age": 23, "gender": true},
            {"name": "李四1", "age": 24, "gender": true},
            {"name": "王五1", "age": 25, "gender": false}
        ]
    };
    $.each(obj,function (index,element) {
        //获取每一个对象
        for (let person of element) {
            for (let key in person) {
                let value = person[key];
                console.log(key+":"+value);
            }
        }
    })

</script>

使用$.each遍历JSON对象

<script>
    var obj = {
        "persons": [
            {"name": "张三1", "age": 23, "gender": true},
            {"name": "李四1", "age": 24, "gender": true},
            {"name": "王五1", "age": 25, "gender": false}
        ]
    };
    $.each(obj,function (index,element) {
        //获取每一个对象
        for (let person of element) {
            for (let key in person) {
                let value = person[key];
                console.log(key+":"+value);
            }
        }
    })

</script>

JSON与JAVA数据转换

常见json解析器

Jsonlib,Gson,fastjson,jackson
以Jackson为例

Java对象转JSON

在Jackson中提供了一个核心对象ObjectMapper，在这个对象提供了JSON与JAVA相互转换的功能

ObjectMapper相关方法

writeValue(File destPath,Object obj)将obj对象转换为JSON字符串，并保存到指定的文件中
writeValue(OutputStream os,Object obj)将obj对象转换为JSON字符串，并将json数据填充到自己输出流中
writeValue(Write write,Object obj)将obj对象转换为JSON字符串，并将json数据填充到字符输出流中
writeValueAsString(Object obj)将对象转为json字符串

Jackson相关注解

@JsonIgnore排除属性
@JsonFormat属性值的格式化@JsonFormat(pattern="yyyy-MM-dd)

使用步骤

1. 导入Jackson的相关jar包
2. 创建Jackson和新对象ObjectMapper
3. 调用objectMapper的相关方法进行转换

json工具类

/**
 * @author lifly
 * @date 2021/6/20 0020 11:48
 */
public class ObjectMapperUtil {

    //将User对象序列化为Json对象
    public static String ObjectToJson(User user) throws JsonProcessingException {
        ObjectMapper objectMapper = new ObjectMapper();
        String json = objectMapper.writeValueAsString(user);
        return json;
    }
    //将list对象转换为Json对象
    public static String listToJson(List<User>list) throws JsonProcessingException {
        ObjectMapper objectMapper = new ObjectMapper();
        String json = objectMapper.writeValueAsString(list);
        return json;
    }
    //将Map对象序列化为Json对象
    public static String mapToJson(Map<String, ArrayList<User>> map) throws JsonProcessingException {
        ObjectMapper objectMapper = new ObjectMapper();
        String json = objectMapper.writeValueAsString(map);
        return json;
    }
}

对象、List、Map转JSON

1. javaBean

/**
 * @author lifly
 * @date 2021/6/20 0020 11:55
 */
public class User {
    //日期转换为字符串
    private static   SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
    private String username;
    private String sex;
    private int age;
    private String birthday;
    public User() {
    }

    public User(String username,  int age, Date birthday) {
        this.username = username;

        this.age = age;
        this.birthday = sdf.format(birthday);
    }

    public User(String username, String sex, int age, Date birthday) {
        this.username = username;
        this.sex = sex;
        this.age = age;
        this.birthday = sdf.format(birthday);
    }

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }

    public String getSex() {
        return sex;
    }

    public void setSex(String sex) {
        this.sex = sex;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    public String getBirthday() {

        return birthday;
    }
    public void setBirthday(Date birthday) {
        this.birthday= sdf.format(birthday);
    }


    @Override
    public String toString() {
        return "User{" +
                "username='" + username + '\'' +
                ", sex='" + sex + '\'' +
                ", age=" + age +
                ", birthday=" + birthday +
                '}';
    }
}

2. 测试

/**
 * @author lifly
 * @date 2021/6/20 0020 11:47
 */
public class ObjectMapperTest {

    /**
     * 将对象转换为json
     */
    @Test
    public void ObjectMapperJson(){
        User user = new User("jack", "男", 13, new Date());
        String s = null;
        try {
            s = ObjectMapperUtil.ObjectToJson(user);
        } catch (JsonProcessingException e) {
            e.printStackTrace();
        }
        System.out.println(s);
    }

    /**
     * 将list集合转换为json字符串
     */
    @Test
    public void ArrayListToJson() throws JsonProcessingException {
        //创建list集合
        ArrayList<User> users = new ArrayList<>();
        users.add(new User("tom","男",12,new Date()));
        users.add(new User("jane","女",13,new Date()));
        String json = ObjectMapperUtil.listToJson(users);
        System.out.println(json);
    }
    @Test
    public void MapToJson() throws JsonProcessingException {
        //创建list集合
        ArrayList<User> list = new ArrayList<>();
        list.add(new User("tom","男",12,new Date()));
        //创建map对象
        HashMap<String, ArrayList<User>> map = new HashMap<>();
        map.put("one",list);
        String json = ObjectMapperUtil.mapToJson(map);
        System.out.println(json);
    }
}

JSON转Java对象

相关方法

readValue(String json,Class clazz)将指定的json字符串转换成指定的对象

使用步骤

1. 导入Jackson的相关jar包
2. 创建Jackson和新对象ObjectMapper
3. 调用objectMapper的相关方法进行转换
   *readValue(json字符串数据，class)

代码实现

/**
 * @author lifly
 * @date 2021/6/20 0020 15:20
 */
public class StringToObject {
    //创建ObjectMapper对象
    private static ObjectMapper mapper = new ObjectMapper();
    public static void main(String[] args) throws IOException {
        String json1 = "{\"username\":\"张三\",\"age\":13,\"birthday\":\"2021-03-10\"}";
        User user = jsontoUser(json1, User.class);
        System.out.println(user);
    }
    public static User jsontoUser(String json,Class cls) throws IOException {
        return (User) mapper.readValue(json,cls);
    }
}