欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Java web:AJAX&JSON

程序员文章站 2024-01-30 20:25:22
...

AJAX

  • ASynchronous JavaScript And XML 异步的JavaScript 和 XML
  • 异步和同步:客户端和服务器端相互通信的基础上
    • 同步:客户端必须等待服务器端的响应,在等待期间不能做其他操作
    • 异步:客户端无需等待服务器端的响应,在等待服务器处理请求的过程中,客户端可以进行其他的操作
  • AJAX是一种无需加载整个网页的情况下,更够更新部分网页的技术,通过后台与服务器的少量数据交换,AJAX可以使网页实现异步更新。意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
  • 实现方式:
    • 原生的JS实现AJAX(了解):
      • 创建核心对象:var xmlhttp;
      • 建立连接:xmlhttp.open("GET","ajaxServlet?username=tom",true);
        • 参数:
          • 请求方式:GET、POST
            • get方式,请求参数在URL后边拼接。send方法为空参
            • post方式,请求参数在send方法中定义
          • 请求的URL:
          • 同步或异步请求:true(异步)或 false(同步)
      • 发送请求:xmlhttp.send();
      • 接受并处理来自服务器的响应结果:获取方式xmlhttp.responseText
        • 当服务器响应成功后再获取,即当xmlhttp对象的就绪状态改变时,触发事件onreadystatechange。:xmlhttp.onreadystatechange=function(){}
        • 判断readyState就绪状态是否为4,判断status响应状态码是否为200:if (xmlhttp.readyState==4 && xmlhttp.status==200)
        • 获取服务器的响应结果:var responseText = xmlhttp.responseText;
    • JQeury实现方式
      • $.ajax()
        • 语法:$.ajax({键值对})
        • 例如:使用ajax发送异步请求
$.ajax({
	url:"ajaxServlet",	// 请求路径
	type:"POST",	//请求方式
	data:{"username":"tom","age":23},	//请求参数
	success:function(data){		//回调函数
		alert(data);
	},
	error:function(){	//如果请求响应出现错误,会执行的回调函数
		alert("出错了");
	},
	dataType:"text"	//设置接受到的数据格式
})
    • $.get():发送get请求
      • 语法:$get(url,[data],[callback],[type])
      • 参数:
        • url:请求路径
        • data:请求参数
        • callback:回调函数
        • type:响应结果的类型
    • $.post():发送post请求(其他同上)

JSON

  • JavaScript Object Notation JavaScript对象表示法
    • 多用于存储和交换文本信息的语法
    • 进行信息的传输
    • JSON比XML更小,更快,更易传输
  • 语法:
    • 基本规则:
      • 数据在键值对中:json数据是由键值对构成的
      • 键用引号(单双都可)引起来,也可以不写引号
      • 值得类型:
        • 数字(整数或者浮点数)
        • 字符串(要用双引号引起来)
        • 逻辑值(true或false)
        • 数组(在方括号中)如:{"person":[{}],[{}]}
        • 对象(在花括号中)如:{"address":{"province":"湖南","市":"长沙",...}}
        • null
      • 数据由逗号分隔:多个键值对由逗号分隔
      • 花括号定义对象:使用{}定义json格式
      • 方括号保存数组:[]
    • 获取数据:
      • json对象.键名 如person.name
      • json对象[“键名”] 如person["name"]
      • 数组对象[索引] 如person[2]
      • 遍历:for…in…
        • for(var key in person){}
    • JSON数据和Java对象的相互转换
      • JSON解析器:常见:Jsonlib,Gson,fastjson,jackson
      • Java对象转JSON对象
        • 步骤:
          • 导入jackson的相关jar包
          • 创建jackson的核心对象ObjectMapper
          • 调用ObjectMapper的方法进行转换
            • 转换方法:
              • writeValue(参数1,obj)
                • 参数1:
                  • File:将obj对象转换为JSON字符串,并保存到指定的文件中
                  • Writer:将obj对象转换为JSON字符串,并将JSON数据填充到字符输出流中
                  • OutputStream:将obj对象转换为JSON字符串,并将json数据填充到字节输出流中
              • writeValueAsString(obj):将对象转换为JSON字符串
            • 注解:
              • @JsonIgnore:在json在进行对相关操作时排除被注解的该属性
              • @JsonFormat:属性值格式化
                • @JsonFormat(pattern = "yyyy-MM-dd")
            • 复杂java对象转换
              • List:转换为json数组
              • Map:与对象格式一致
      • JSON对象转java对象:
        • 调用的方法不同:
          • readValue(Json字符串数据对象,目标对象名.class)
  • 案例:
    • 校检用户名是否被占用(失去焦点时)
      • 注意:服务器响应的数据,在客户端使用时,要想作为JSON数据格式来使用,有两种解决方案
        • $.get()中指定最后一个参数为“json”(不指定默认根据HTTP包的MIME类型来只能判断,也就是预期服务器返回的数据类型)
        • 在服务器端设置MIME类型:
          • response.setContentType("application/json;charset=utf-8");