javaee之ajax

什么是AJAX

全名：Asynchronous Javasrcript and xml

也就是说，它是异步的javascript 与 xml

下面说一下异步与同步

AJAX就是一种无需重新加载整个网页的情况下，能够更新部分网页的技术

AJAX利用一个构建到所有现代浏览器内部的对象-XMLHttpRequest-来实现发送和接收HTTP请求与响应信息。可以通过window.XMLHttpRequest对象来判断这个对象是否存在，现在的浏览器基本上都会存在这样一个名叫XMLHttpRequest对象，在最早的IE里面他叫ActiveHttpRequest对象。

这个对象可以去设置是以同步还是异步的方式来发送这个请求。

怎么来实现ajax这样一个过程

这里可以参考w3school手册，下面来简要的说一说

现在我们要通过前端页面去访问一个servlet并传入一个参数过去

稍微看一下目录结构

先来一个前端页面

demo1.html




    
    Title

再来看servlet页面

AjaxServlet1.java

package pxx.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/ajaxServlet1")
public class AjaxServlet1 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //通过ajax来访问到了一下这个页面
        //直接可以来拿到参数
        String name = request.getParameter("name");

        //在服务器打印一下这个名字
        System.out.println("名字是:" + name);

        //这里给客户端做出响应
        response.getWriter().write("你好 " + name);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
    }
}

上面就会在服务器打印一个名字：

上面就是利用ajax向服务器发送了一个请求，那么我们如何来看异步与同步的情况呢？

我们把服务器Servlet的代码重新修改一下

package pxx.web.servlet;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/ajaxServlet1")
public class AjaxServlet1 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //通过ajax来访问到了一下这个页面
        //直接可以来拿到参数
        String name = request.getParameter("name");

        //在这个位置让服务器停几秒
        try {
            Thread.sleep(6000);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
        //在服务器打印一下这个名字
        System.out.println("名字是:" + name);

        //这里给客户端做出响应
        response.getWriter().write("你好 " + name);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
    }
}

中间我们让服务器页面停留了几秒,也就是让这个程序没有处理完毕，如果前端页面按照同步的方式发送数据，那么就会出现必须等待这个程序执行完之后，才可以执行其他操作，下面我们分别写一个同步与异步处理的按钮，分别看一下什么情况

demo1.html




    
    Title

前端页面展示如下：

如果我们点发送异步请求，右边的输入框是可以持续输入的

如果我们点同步发送请求，右边的输入框在服务器的页面没有处理完之前是不能输入的

上面重点说了一下如何发送请求，与同步、异步的一个展示问题，下面我们还要去处理服务器给我们响应的结果啊，这个也可以去查手册找到对应的方法

看一下这个readState状态码

我们来改善一下代码




    
    Title

运行结果：

如何用jquery的方式来实现ajax

先来查一下手册

下面说一下$.ajax、$.get、$.post的用法

$.ajax




    
    Title

$.get




    
    Title

$.post




    
    Title

json的数据格式

什么是json呢

全称就是 javascript object notation,也就是说它是javascript的对象表示法

json主要是用于存储、交换、传输文本信息，它有点类似于XML，但是比XML更快、更小、更容易解析

说一下json的语法格式

话不多说，直接上代码




    
    Title

如何获取json数据

话不多说，直接上代码




    
    Title

JSON数据的遍历

其实直接采用for in循环就可以了




    
    Title

json数据和java对象相互转换

先来看一下json的常见解析器：

Jsonlib、fastjson、jackson等等这些包

下面我们要用到的就是jackson这个包

先来说将Java对象转为json字符串数据

这里来说一下它的步骤

1.导入Jackson的相关jar包

2.创建jackson的核心对象ObjectMapper

3.调用ObjectMapper的相关方法进行转换

这里来说一下ObjectMapper中的核心方法

现在来说一下上面两个方法，第一个writeValue这个方法是做了一个重载，如下：也就是说这个参数1有三种类型可选,基本就是说把这个对象的数据传入到参数1指定的某一个文件当中。

第二个方法就是直接把java对象变成json字符串形式。

下面来看一个简单的转换形式

先来看一个对象Person

package pxx.domain;

public class Person {
    private String name;
    private int age;
    private String gender;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getAge() {
        return age;
    }

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

    public String getGender() {
        return gender;
    }

    public void setGender(String gender) {
        this.gender = gender;
    }

    @Override
    public String toString() {
        return "Person{" +
                "name='" + name + ''' +
                ", age=" + age +
                ", gender='" + gender + ''' +
                '}';
    }
}

然后写一个Jackson测试类

JacksonTest.java

package pxx.test;


import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.junit.Test;
import pxx.domain.Person;

import java.io.File;
import java.io.FileOutputStream;
import java.io.FileWriter;

public class JacksonTest {

    //java对象转为json字符串
    @Test
    public void test1() throws Exception {
        //创建一个java对象
        Person p = new Person();
        p.setAge(20);
        p.setGender("男");
        p.setName("张哈哈");
        //创建jackson核心对象
        ObjectMapper objectMapper = new ObjectMapper();
        //直接利用writeValueAsString()方法把对象变成json字符串
        String res = objectMapper.writeValueAsString(p);
        //会向这个文件写入内容,把writeValue这几个重载的方法都调用一下
        objectMapper.writeValue(new File("D://a.txt"),p);
        objectMapper.writeValue(new FileWriter("D://a1.txt"),p);
        objectMapper.writeValue(new FileOutputStream("D://a2.txt"),p);
        System.out.println(res);
    }

}

先来看控制台的运行结果

再去看这几个文件

这几个文件都是如下：

下面说一下注解的使用，假如我们在开发过程中，我们不想去转换某个属性或者说，我想把这个属性按照一个好看的格式打印出来，那么就要用到如下两个注解

比如上面代码做一些修改

给gender添加了一个@JsonIgnore注解，就表示忽略这个属性，那么打印的时候，就会忽略

在来看@JsonFormat，还是把这个Person做一些修改，添加一个birthday属性，并且为其指定打印格式

我们想要按照我们想要的格式进行打印，先设置

然后打印

下面说一下集合java对象转成JSON数据怎么转

先看List集合对象

package pxx.test;


import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.junit.Test;
import pxx.domain.Person;

import java.io.File;
import java.io.FileOutputStream;
import java.io.FileWriter;
import java.io.IOException;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

public class JacksonTest {

    //java对象转为json字符串
    @Test
    public void test1() throws Exception {
        //创建一个java对象
        Person p = new Person();
        p.setAge(20);
        p.setGender("男");
        p.setName("张哈哈");
        p.setBirthday(new Date());
        //创建jackson核心对象
        ObjectMapper objectMapper = new ObjectMapper();
        //直接利用writeValueAsString()方法把对象变成json字符串
        String res = objectMapper.writeValueAsString(p);
        //会向这个文件写入内容,把writeValue这几个重载的方法都调用一下
        objectMapper.writeValue(new File("D://a.txt"),p);
        objectMapper.writeValue(new FileWriter("D://a1.txt"),p);
        objectMapper.writeValue(new FileOutputStream("D://a2.txt"),p);
        System.out.println(res);
    }

    @Test
    public void test2() throws IOException {
        //我们先做两个对象，然后放到集合里
        //创建一个java对象
        Person p1 = new Person();
        p1.setAge(20);
        p1.setGender("男");
        p1.setName("张哈哈");
        p1.setBirthday(new Date());

        //创建一个java对象
        Person p2 = new Person();
        p2.setAge(20);
        p2.setGender("男");
        p2.setName("张哈哈");
        p2.setBirthday(new Date());

        List list =new ArrayList();
        list.add(p1);
        list.add(p2);

        //创建json核心对象
        ObjectMapper objectMapper = new ObjectMapper();
        //变成json对象，然后输出到文件里面
        objectMapper.writeValue(new File("D://b.txt"),list);
        //直接打印到控制台
        String str = objectMapper.writeValueAsString(list);
        System.out.println(str);
    }
}

运行结果：

文件里面去看看

上面就明显会把List集合对象中的数据变成一个数组的形式存放

再来看一下map集合

package pxx.test;


import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.junit.Test;
import pxx.domain.Person;

import java.io.File;
import java.io.FileOutputStream;
import java.io.FileWriter;
import java.io.IOException;
import java.util.*;

public class JacksonTest {

    //java对象转为json字符串
    @Test
    public void test1() throws Exception {
        //创建一个java对象
        Person p = new Person();
        p.setAge(20);
        p.setGender("男");
        p.setName("张哈哈");
        p.setBirthday(new Date());
        //创建jackson核心对象
        ObjectMapper objectMapper = new ObjectMapper();
        //直接利用writeValueAsString()方法把对象变成json字符串
        String res = objectMapper.writeValueAsString(p);
        //会向这个文件写入内容,把writeValue这几个重载的方法都调用一下
        objectMapper.writeValue(new File("D://a.txt"),p);
        objectMapper.writeValue(new FileWriter("D://a1.txt"),p);
        objectMapper.writeValue(new FileOutputStream("D://a2.txt"),p);
        System.out.println(res);
    }

    @Test
    public void test2() throws IOException {
        //我们先做两个对象，然后放到集合里
        //创建一个java对象
        Person p1 = new Person();
        p1.setAge(20);
        p1.setGender("男");
        p1.setName("张哈哈");
        p1.setBirthday(new Date());

        //创建一个java对象
        Person p2 = new Person();
        p2.setAge(20);
        p2.setGender("男");
        p2.setName("张哈哈");
        p2.setBirthday(new Date());

        List list =new ArrayList();
        list.add(p1);
        list.add(p2);

        //创建json核心对象
        ObjectMapper objectMapper = new ObjectMapper();
        //变成json对象，然后输出到文件里面
        objectMapper.writeValue(new File("D://b.txt"),list);
        //直接打印到控制台
        String str = objectMapper.writeValueAsString(list);
        System.out.println(str);
    }

    @Test
    public void test3() throws JsonProcessingException {
        //Map集合直接整成键值对
        //1.创建map对象
        Map map = new HashMap();
        map.put("name","王大麦子");
        map.put("age",520);
        map.put("gender","男");


        //2.转换
        ObjectMapper mapper = new ObjectMapper();
        String json = mapper.writeValueAsString(map);
        System.out.println(json);
    }
}

运行结果：

下面简要说一下，json数据对象怎么变成java对象

1. 还是导入json的包

2.创建核心对象ObjectMapper对象

3.调用方法readValue(json字符串数据，类的Class对象)

话不多说，直接上代码

package pxx.test;


import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.junit.Test;
import pxx.domain.Person;

import java.io.File;
import java.io.FileOutputStream;
import java.io.FileWriter;
import java.io.IOException;
import java.util.*;

public class JacksonTest {

    //java对象转为json字符串
    @Test
    public void test1() throws Exception {
        //创建一个java对象
        Person p = new Person();
        p.setAge(20);
        p.setGender("男");
        p.setName("张哈哈");
        p.setBirthday(new Date());
        //创建jackson核心对象
        ObjectMapper objectMapper = new ObjectMapper();
        //直接利用writeValueAsString()方法把对象变成json字符串
        String res = objectMapper.writeValueAsString(p);
        //会向这个文件写入内容,把writeValue这几个重载的方法都调用一下
        objectMapper.writeValue(new File("D://a.txt"),p);
        objectMapper.writeValue(new FileWriter("D://a1.txt"),p);
        objectMapper.writeValue(new FileOutputStream("D://a2.txt"),p);
        System.out.println(res);
    }

    @Test
    public void test2() throws IOException {
        //我们先做两个对象，然后放到集合里
        //创建一个java对象
        Person p1 = new Person();
        p1.setAge(20);
        p1.setGender("男");
        p1.setName("张哈哈");
        p1.setBirthday(new Date());

        //创建一个java对象
        Person p2 = new Person();
        p2.setAge(20);
        p2.setGender("男");
        p2.setName("张哈哈");
        p2.setBirthday(new Date());

        List list =new ArrayList();
        list.add(p1);
        list.add(p2);

        //创建json核心对象
        ObjectMapper objectMapper = new ObjectMapper();
        //变成json对象，然后输出到文件里面
        objectMapper.writeValue(new File("D://b.txt"),list);
        //直接打印到控制台
        String str = objectMapper.writeValueAsString(list);
        System.out.println(str);
    }

    @Test
    public void test3() throws JsonProcessingException {
        //Map集合直接整成键值对
        //1.创建map对象
        Map map = new HashMap();
        map.put("name","王大麦子");
        map.put("age",520);
        map.put("gender","男");


        //2.转换
        ObjectMapper mapper = new ObjectMapper();
        String json = mapper.writeValueAsString(map);
        System.out.println(json);
    }

    //JSON数据变成java对象
    @Test
    public void test4() throws IOException {
        //先来看json数据
        String json = "{"gender":"男","name":"张三","age":23}";

        ObjectMapper objectMapper = new ObjectMapper();

        Person person = objectMapper.readValue(json,Person.class);

        System.out.println(person);
    }
}

运行结果：

验证用户名是否存在的实际案例

先来看一下百度的这个注册页面

当我输入一个用户名，它就会发送一个ajax的请求呢，也就是说，他会对页面进行部分刷新，因为要去请求服务器。OK，那么他就会去判断你这个用户名是否存在数据库当中，如果说，你这个用户名存在，那么当鼠标失去焦点的时候，就会提示如下信息

那么如果可以用，就不会提示

那么，我还想说一点，上面服务器给我们返回的是不是一个键呢，json数据格式，然后客户端就会去根据这个键值来进行一个判断，比如百度这个键值就是下面这个

存在就是1，不存在就是0

上面就说明了一下大致的逻辑步骤，下面直接上代码

先看一个前端注册页面register.html




    
    Title

然后再去看服务器页面FindUserServlet.java

package pxx.web.servlet;

import com.fasterxml.jackson.databind.ObjectMapper;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

@WebServlet("/findUserServlet")
public class FindUserServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setContentType("application/json;charset=utf-8");
        //还是拿到参数，同过ajax进行的一个异步请求
        String username = request.getParameter("username");
        //这里做一个map集合，存放数据，等会也方便我们把map集合变成json数据发送给客户端
        Map map = new HashMap();
        //然后这里就去连接数据库，查询用户存在否，那么这里我就模拟好了
        if("pxx".equals(username)) {
            //用户存在,这个键为true
            map.put("userExsit",true);
            //提示一个信息
            map.put("userInfo","用户已存在");
        } else {
            map.put("userExsit",false);
            map.put("userInfo","恭喜");
        }

        //将map对象转为json数据格式传给客户端
        ObjectMapper objectMapper = new ObjectMapper();
        objectMapper.writeValue(response.getWriter(),map);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
    }
}

运行结果：

我这里是除了pxx之外，都可以注册

输入pxx

好了，说到这

javaee之ajax

Java相关栏目本月热门文章