Java学习--初学Ajax

最新推荐文章于 2023-03-06 12:08:40 发布

lyf_0922

最新推荐文章于 2023-03-06 12:08:40 发布

阅读量213

点赞数 2

本文链接：https://blog.csdn.net/lyf_0922/article/details/86558431

版权

一、Ajax

1、ajax的定义

AJAX是异步的JavaScript和ML的简称，可以开发出非常灵敏无刷新的网页，特别是开发服务器端网页时，比如PHP网站，需要往返地与服务器通信，如果不使用AJAX，每次数据更新不得不重新刷新网页，而使用AJAX特效后，可以对页面进行局部刷新，提供动态的效果。

多种技术的统称

a - asynchronous - 可以通过 xhr 对象发送异步请求
j - javascript
a - and
x - xml - 指响应格式
Ajax 是一种用于创建快速动态网页的技术。
Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。

2. XMLHttpRequest 对象基本使用

2.1. 创建 xhr 对象

var xhr = new XMLHttpRequest();

2.2. 发送请求

xhr.open("get|post", 请求地址, true|false); // 发请求前准备
xhr.send(); // 真正发送请求

open的第三个参数（true|false）：
true 默认值 – 异步请求, send 方法不会阻塞，页面其他代码，视频都不会等待响应，继续执行
false – 同步请求响应没有返回之前，页面代码、视频都会暂停，直到响应返回为止，send方法在此期间一直处于阻塞状态

2.3. 接收响应

xhr.responseText

需要的响应通常不是一个完整的html，而是一个html片段，或是一个字符串

2.4. 异步请求

异步请求下需要使用事件的机制来接收响应

// 响应返回会触发 onload事件，执行事件对应的函数
xhr.onload = function () {
};

2.5. post 请求

get 请求只有请求行和请求头
post 请求行、请求头、请求体

var xhr = new XMLHttpRequest();
xhr.onload = function(){};

// 发请求
xhr.open("post", url, true);
xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded"); // 告诉服务器，请求体的格式是：表单格式
xhr.send("请求体内容"); // 参数名=参数值&参数名=参数值

二、响应格式

1、分类

主流格式有两种：

1) xml (可扩展标记语言)

<response>
    <time>2019-1-19 11:43:33</time>
    <author>张三</author>
    <content>还不错</content>
    <score>11</score>
</response>

var xml = xhr.responseXML;
xml.getElementsByTagName(“time”)[0].innerText;

2) json (javascript object 对象 notation 标记)

简单地说，JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串，然后就可以在网络或者程序之间轻松地传递这个字符串，并在需要的时候将它还原为各编程语言所支持的数据格式，例如在 PHP 中，可以将 JSON 还原为数组或者一个基本对象。在用到AJAX时，如果需要用到数组传值，这时就需要用JSON将数组转化为字符串。

{
“time”:“2019-1-19 11:43:33”,
“author”:“张三”,
“content”: “还不错”,
“score”: 11
}
var obj = …
obj.time

json中除了解析方便外，还支持更多类型字符串、数字、布尔值、数组、对象

2、JSON

2.1. 把 java 对象转换为 json 字符串, 或反之

转换json的第三方 api: gson（谷歌），jackson（spring），fastjson（阿里）…

2.2. js 对象和 json 字符串相互转换

var js对象 = JSON.parse(json字符串);
var json字符串 = JSON.stringify(js对象);

2.3 jackson

2.3.1重要的类:

ObjectMapper om = new ObjectMapper();
String json = om.writeValueAsString(java对象);

2.3.2 注解

如果要对日期进行控制，在日期属性上添加注解: @JsonFormat(pattern=“日期格式”, timezone=“GMT+08”) 注：东八区故加8
如果要忽略某个属性：在属性上添加一个 @JsonIgnore 注解，用于重要敏感内容
如果要转换后改变属性名：@JsonProperty(“新属性名”)
java中的map，domain ==> 都会转为 json 的对象 { }
java中的list, set, 数组 ==> 都会转为 json 的数组 [ ]

2.3.3 还原操作

ObjectMapper om = new ObjectMapper();
类型 java对象 = om.readValue(json字符串, 类.class);

2.3.4 servlet 中结合 jackson

resp.setCharacterEncoding("utf-8");
resp.setContentType("application/json;charset=utf-8");
List<Student> list = new ArrayList<>();
list.add(new Student(1, "123", "张三", "男", new Date()));
list.add(new Student(2, "456", "李四", "男", new Date()));
list.add(new Student(3, "789", "王五", "男", new Date()));
ObjectMapper om = new ObjectMapper();

方法1：

String json = om.writeValueAsString(list);
resp.getWriter().print(json);

方法2：

om.writeValue(resp.getWriter(), list);