JavaWeb之Ajax_JS和使用GSON.jar转换JSON格式

简介

一种用于网页异步请求的技术, 用于与服务器进行异步交互,以及局部网页的刷新.

ajax_JS的GET请求使用步骤

//在JavaScript中使用函数或绑定事件
//1. 创建一个用于异步请求的对象
var xhr = new XMLHttpRequest();
//2.  设置请求的方式 以及请求地址
xhr.openxhr.open("GET","地址?参数列表");
//3.  设置请求结果产生时 的 处理函数
//(此函数在一次 请求中会执行多次 , 当请求状态每改变一次, 则触发一次)
xhr.onreadystatechange = function(){
  //4.  获取请求状态码, 根据状态码判断请求到了哪一步.
    if(xhr.readyState == 4){
      //5.  判断响应的状态码 (404资源找不到 , 500服务器内部错误 , 200成功 等等)
      if(xhr.status == 200){
        //6.  获取到响应体(xhr.responseText)
        if(xhr.responseText == 1){
          //注册成功
          layer.close(i);
          layer.msg("恭喜你, 注册成功");
        }else{
          //注册失败
          layer.close(i);
          layer.msg("很遗憾, 注册失败");
        }
      }else{
        //错误的提示
          layer.close(i);
          layer.msg("很遗憾,请检查您的网络");
      }
    }
}
//7.  设置请求头部
xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
//8.  将请求发送 (参数列表格式: 与GET请求?后的格式一致)
xhr.send("uname="+uname+"&upass="+upass);

注意:

xhr.readyState :
  表示请求状态 , 值:
    0 : 请求初始化中
    1 : 请求正在发送
    2 : 请求发送完毕
    3 : 服务器开始响应
    4 : 响应完毕,连接已断开,回复的内容已经得到了

ajax_JS的POST请求使用步骤

//在JavaScript中使用函数或绑定事件
//1. 创建一个用于异步请求的对象
var xhr = new XMLHttpRequest();
//2.  设置请求的方式 以及请求地址
xhr.openxhr.open("POST","地址");
//3.  设置请求结果产生时 的 处理函数
//(此函数在一次 请求中会执行多次 , 当请求状态每改变一次, 则触发一次)
xhr.onreadystatechange = function(){
  //4.  获取请求状态码, 根据状态码判断请求到了哪一步.
    if(xhr.readyState == 4){
      //5.  判断响应的状态码 (404资源找不到 , 500服务器内部错误 , 200成功 等等)
      if(xhr.status == 200){
        //6.  获取到响应体(xhr.responseText)
        if(xhr.responseText == 1){
          //注册成功
          layer.close(i);
          layer.msg("恭喜你, 注册成功");
        }else{
          //注册失败
          layer.close(i);
          layer.msg("很遗憾, 注册失败");
        }
      }else{
        //错误的提示
          layer.close(i);
          layer.msg("很遗憾,请检查您的网络");
      }
    }
}
//7.  设置请求头部
xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
//8.  将请求发送 (参数列表格式: 与GET请求?后的格式一致)
xhr.send("uname="+uname+"&upass="+upass);

注意:

xhr.readyState:
  表示请求状态,值:
    0 : 请求初始化中
    1 : 请求正在发送
    2 : 请求发送完毕
    3 : 服务器开始响应
    4 : 响应完毕 ,连接已断开, 回复的内容已经得到了

Ajax跨域实现

如果访问服务器上的地址,我们要在servlet的代码中,在响应之前加入如下两行代码,然后运行把生成的代码放在服务器上,即可实现:

response.addHeader("Access-Control-Allow-Origin","*");
response.addHeader("Access-Control-Allow-Methods","GET,POST");

通过GSON.jar更快速的生成JSON格式字符串

步骤:

1.引入gson.jar文件
2.在需要将对象转为JSON字符串的位置, 加入如下格式代码即可:
  String json = new Gson().toJSON(对象);

对象:

String json2 = new Gson().toJson(u);

集合:

ArrayList<User30> data = new ArrayList<>();
for(int i=0;i<100;i++) {
  User30 u = new User30(1001+i, "dsg"+i, "123"+i);
  data.add(u);
}
String json = new Gson().toJson(data);
System.out.println(json);

通过GSON.jar将JSON格式字符串,转换为对象,并取出其中属性.

前提条件:

1.JSON格式的字符串, 格式必须正确.
2.JSON字符串中的属性 必须要与准备转换类型属 一致.

要将如下字符串转换为对象,必须存在属性匹配的类,例如:
  字符串:
    {
      "name":"xxx",
      "age":18
    }
  类:
    class 类名{
      private String name;
      private int age;
      get/set...
    }

格式:

1.引入gson.Jar包
2.在需要转换的位置, 加入如下代码:
    对象名 = new Gson().fromJson(JSON字符串,对象类型.class);

案例:

String json = "{\"id\":10001,\"username\":\"zhangsan\",\"password\":\"123456\"}";
User30 u = new Gson().fromJson(json, User30.class);
System.out.println(u.getUsername());

通过GSON.jar将JSON数据,转换为集合

String json = "{\r\n" +
    "\"resultcode\":\"200\",\r\n" +
    "\"reason\":\"成功的返回\",\r\n" +
    "\"result\":{\r\n" +
    " \"area\":\"浙江省温州市平阳县\",\r\n" +
    " \"sex\":\"男\",\r\n" +
    " \"birthday\":\"1989年03月08日\"\r\n" +
    "}\r\n" +
    "}";

Map

Map<String,Object> map = new Gson().fromJson(JSON字符串,Map.class);

List

List<Object> list = new Gson().fromJson(JSON字符串,List.class);