AJAX&JSON&filter

web三大组件（servlet，filter，listener）

过滤器filter

在统一编码处理，登录验证时使用，在用户浏览器和服务器之间做一些通用的功能

过滤器代码

package com.itheima.filter;
​
import javax.servlet.*;
import java.io.IOException;
​
/**
 * @author alex
 * @date 2022/04/18 10:48
 **/
//实现javax.servlet.Filter,重写里面的三个方法init，doFilter，destroy
public class JspFilter implements Filter {
    //filter创建的方法
​
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
​
    }
​
    //过滤器执行拦截的方法
    //servletRequest前端请求对象
    //servletResponse响应对象
    //filterChain过滤器链对象，实现请求放行
    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        System.out.println("过滤器拦截了请求");
        //放行
        filterChain.doFilter(servletRequest, servletResponse);
​
        System.out.println("资源返回后经过了过滤器响应到客户端");
    }
    //filter销毁的方法
    @Override
    public void destroy() {
​
    }
}
​

配置过滤器

<!--tomcat创建过滤器-->
    <filter>
        <filter-name>jspFilter</filter-name>
        <filter-class>com.itheima.filter.JspFilter</filter-class>
    </filter>
    <!--配置过滤器的拦截路径-->
    <filter-mapping>
        <filter-name>jspFilter</filter-name>
        <url-pattern>/target.jsp</url-pattern>
    </filter-mapping>

过滤器的执行流程

1，浏览器向客户端发起请求

2，filter将请求拦截住，开始处理访问资源之前的逻辑

3，filter决定是否要放行请求，如果放行，请求继续向后执行

3，请求访问到相关资源，然后服务器给出响应

4，filter将响应拦截住，开始处理访问资源之后的逻辑

5，服务器将响应返回给浏览器

生命周期

​ 创建的优先级高于servlet，在tomcat启动时创建，仅调用一次init方法

​ 在用户访问目标资源时，匹配成功后进行拦截

​ 在tomcat关闭时销毁，并调用destroy()方法，只调用一次

特点：过滤器优先于所有资源文件的创建，晚于所有资源文件的销毁

拦截路径：可以指定过滤器的拦截路径来定义拦截目标资源范围

​ 1，完全匹配：拦截某一个指定的资源，用的不多 /target.jsp

​ 2，目录匹配：拦截某一个目录下所有的资源 /user/*

​ 3，后缀匹配，拦截某一个指定后缀资源 *.jsp

过滤器注解

​

// @WebFilter(urlPatterns = "/target.jsp")
    //@WebFilter(value = "/target.jsp")
  简化  @WebFilter("/target.jsp")

过滤器链

​ 多个过滤器执行的特点是，先进后出

​ 注解版本的过滤器执行顺序是按照过滤波器类名的首字母ACCI码表的顺序数值小的先执行执行，

​ XML版本的过滤器链可以单独配置他们的执行顺序---根据标签声名的顺序来执行

企业开发中使用多个过滤器一般不用考虑顺序，因为过滤器都有自己特定的功能，

中文乱码过滤器

//拦截所有
@WebFilter("/*")
​
public class CharacterFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
​
    }
​
    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        //如果前端的请求方式为post，处理乱码，请求方式为get不需要处理
        //但是获取前端提交方式的方法在ServletRequest的子接口HttpServletRequest中，需要向下转型
        HttpServletRequest request = (HttpServletRequest) servletRequest;
        HttpServletResponse response = (HttpServletResponse) servletResponse;
        if (request.getMethod().equalsIgnoreCase("post")) {
            //指定请求解码方式
            servletRequest.setCharacterEncoding("UTF-8");
​
        }
​
​
        //放行
        filterChain.doFilter(request, response);
​
​
    }
​
    @Override
    public void destroy() {
​
    }
}

资源访问过滤器

//拦截用户登录后才能看到的页面
    @WebFilter("/user/*")
public class UserFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
        
    }
​
    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        
        //向下转型
        HttpServletRequest request = (HttpServletRequest) servletRequest;
        HttpServletResponse response = (HttpServletResponse) servletResponse;
        
        //获取session对象
        HttpSession session = request.getSession();
        //获取用户信息
        Object user = session.getAttribute("user");
        //判断
        if (user==null) {
            //没有登录，拦截,重定向到登录页面
            response.sendRedirect(request.getContextPath()+"/login.jsp");
            return;
        }
        //登录了，放行
        filterChain.doFilter(request, response);
​
    }
​
    @Override
    public void destroy() {
​
    }
}

listener（监听器--了解）Spring框架已经封装好了

主要用于统计在线人数，系统启动时初始化配置信息，监视域对象的创建和销毁

JSON（重点）JavaScript Object Notation 就是JavaScript对象

不同语言之间数据交互传输的载体，数据共享

let user = {"username":"后裔","age":23,"sex":"男"}; 就相当于在java中new一个user对象，存入后裔信息

<!DOCTYPE html><html lang="en"><head>

<meta charset="UTF-8">
<title>Title</title>

</head><body>

<script>

// 1.描述用户对象（张三丰、男、32岁）
/*
    User user = new User("张三丰","男",32);
*/
let user ={"username":"张三丰","sex":"男","age":32};
console.log(user.username);
console.log(user.sex);
console.log(user.age);
​
// 2.描述用户数组（张三丰、张翠山、张无忌）
/*
   List<User> list = new ArrayList();
   list.add(new User("张三丰","男",32));
   list.add(new User("张翠山","男",22));
   list.add(new User("张无忌","男",12));
*/
console.log("------------");
let list = [
    {"username":"张三丰","sex":"男","age":32},
    {"username":"张翠山","sex":"男","age":22},
    {"username":"张无忌","sex":"男","age":12}
]
// iter 出现增强for循环
for (let user of list) {
    console.log(user.username);
}
console.log("------------");
// 3.描述韦小宝（27岁，老婆、师傅）
/*
  Weixiaobao xiaobao = new Weixiaobao();
  xiaobao.setAge(27);
  xiaobao.setWife(list);
  xiaobao.setTeacher(chenjinnan)
*/
let xiaobao={
    "age":27,
    "wife":[
        {"username":"建宁"},
        {"username":"阿珂"},
        {"username":"双儿"}
    ],
    "teacher":{"username":"陈近南","address":"台湾"}
}
console.log(xiaobao.age);
console.log(xiaobao.wife[1]);
console.log(xiaobao.teacher.username);

</script></body></html>

java转json

public class JacksonTest {
    //java to jason
    @Test
    public void test01() throws Exception{
        //创建jason转化工具
        ObjectMapper objectMapper = new ObjectMapper();
​
        //对象
        User user = new User("jack",18);
        //将user转化成字符串
        String json = objectMapper.writeValueAsString(user);
        System.out.println(json);//{"name":"jack","age":18}
​
        //map,无序集合
        Map map = new HashMap();
        map.put("username", "lucy");
        map.put("age", "23");
        String json2 = objectMapper.writeValueAsString(map);
        System.out.println(json2);//{"age":"23","username":"lucy"}
        //list
        ArrayList<User> list = new ArrayList<>();
        list.add(new User("安其拉",19));
        list.add(new User("王昭君",21));
        list.add(new User("庄周",21));
        String json3 = objectMapper.writeValueAsString(list);
        System.out.println(json3);//[{"name":"安其拉","age":19},{"name":"王昭君","age":21},{"name":"庄周","age":21}]
​
    }

json转java

public void test02()throws Exception{
    //创建jackson工具类
    ObjectMapper objectMapper = new ObjectMapper();
    //对象json-->类 如果刚好有实体类对应接收数据就用这种方式
​
    String json="{\"name\":\"jack\",\"age\":18}";
    User user = objectMapper.readValue(json, User.class);
    System.out.println(user);
    //map集合json-->map  如果接收的数据比较乱就用万能的map集合
    String json2 = "{\"age\":\"23\",\"username\":\"lucy\"}";
    Map map = objectMapper.readValue(json2, Map.class);
    System.out.println(map);
​
    //list集合json-->list
    String json3="[{\"name\":\"安其拉\",\"age\":19},{\"name\":\"王昭君\",\"age\":21},{\"name\":\"庄周\",\"age\":21}]";
    List list = objectMapper.readValue(json3, List.class);
    System.out.println(list);
​
}

AJAX（重点）阿贾克斯（Asynchronous Javascript And XML）异步的Javascript和XML

异步交互技术，代替传统web（jsp，el，jstl），是浏览器提供的一套API，在无需重新加载整个网页的情况下，能够更新部分网页的技术，从而提高用户浏览网站应用的体验。

应用场景：百度输入关键字自动出现相关搜索，注册时的表单验证，每输入一个验证一次

1，导入类库

将axios文件导入web目录下的js文件夹中