Java Web(十一)Ajax&Axios&JSON
Ajax&Axios&JSON
- 概念:AJAX(Asynchronous JavaScript And XML):异步的 JavaScript 和 XML
- AJAX 作用:1.与服务器进行数据交换：通过 AJAX 可以给服务器发送请求，并获取服务器响应的数据
- 使用了 AJAX 和服务器进行通信，就可以使用 HTML+AJAX 来替换 JSP 页面了
- 2.异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如：搜索联想、用户名是否可用校验，等等.
一.AJAX
1.同步异步
1.1 同步
1.2 异步
2.快速入门
- 编写 AjaxServlet,并使用 response 输出字符串
- 创建 XMLHttpRequest 对象：用于和服务器交换数据
var xmlhttp;
if (window.XMLHttpRequest){
//code for IE7+,Firefox,Chrome,Opera,Safari
xmlhttp = new XMLHttpRequest();
)else{
∥code for IE6,IE5
xmlhttp new = ActiveXObject("Microsoft.XMLHTTP");
}
- 向服务器发送请求
xmlhttp.open("GET","url");
xmlhttp.send(O;∥发送请求
- 获取服务器响应数据
xmlhttp.onreadystatechange function (){
if(xmlhttp.readyState ==4 && xmlhttp.status ==200){
alert(xmlhttp.responseText);
}
二.AXIOS
1.Axios 异步框架
- Axios 对原生的 AJAX 进行封装，简化书写
- 官网：https://www.axios-http.cn
2.快速入门
2.1 引入 axios 的 js 文件
<script src="js/axios-0.18.0.js"></script>2.2 使用 axios 发送请求，并获取响应结果
axios({
method:"get",
url:"http://localhost:8080/ajax-demo1/aJAXDemo1?username=zhangsan"
}).then(function (resp){
alert(resp.data);
})
axios((
method:"post",
url:"http://localhost:8080/ajax-demo1/aJAXDemo1",
data:"username=zhangsan"
}).then(function (resp){
alert(resp.data);
}:
3.Axios 请求方式别名
- 为了方便起见，Axos 已经为所有支持的请求方法提供了别名，
- axios.get(url[,config])axios.delete(url[,config])axios.head(url[,config])axios.options(url[,config])axios.post(url[,data[,config]])axios.put(url[,data[,config]])axios.patch(url[,data[,config]])
- 发送 get 请求
axios.get("url")
.then(function (resp){
alert(resp.data);
});
- 发送 psot 请求
axios.post("ur","参数")
.then(function(resp){
alert(resp.data);
}
三.JSON
- 概念：JavaScript Object Notation。JavaScript 对象表示法
1.JSON 基础语法
- 定义:
var变量名={
"key1":value1,
"key2":value2,
...
};
value 的数据类型为:
数字（整数或浮点数）字符串（在双引号中）逻辑值(true 或 false)数组（在方括号中）对象（在花括号中）null
- 实例:
var json {
"name":"zhangsan",
"age":23,
"addr":["北京"，"上海"，"西安]
};
- 获取数据:
变量名.key json.name2.JSON 数据和 Java 对象转换
- 请求数据：JSON 字符串转为 Java 对象
- 响应数据：Java 对象转为 JSON 字符串
- Fastjson 是阿里巴巴提供的一个 Java 语言编写的高性能功能完善的 JSON 库，是目前 Java 语言中最快的 JSON 库，可以实现 Java 对象和 SON 字符串的相互转换。
- 使用 1.导入坐标
<dependency>
<groupld>com.alibaba</groupld>
<artifactld>fastjson</artifactld>
<version>1.2.62</version>
</dependency>
2.Java 对象转 JSON
String jsonStr = JSON.toJSONString(obj);3.JSON 字符转转 Java 对象
User user = JSON.parseobject(jsonStr,User.class);本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2022-11-15，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录