JavaWeb

什么是JavaWeb

web：全球广域网，也称为万维网，能够通过浏览器访问的网站

JavaWeb：是用Java技术来解决相关web互联网领域的技术栈

JavaWeb技术栈

B/S架构：Browser/Server 浏览器/服务器架构模式，它的特点是，客户端只需要浏览器，应用程序的逻辑和数据都存储在服务器端。浏览器只需要请求服务器，获取web资源，服务器 把web资源发送给浏览器即可。

好处：易于维护升级，服务器升级后，客户端无需任何部署就可以使用到新的版本。

静态资源：HTML，css，JavaScript，图片等负责页面展示。

动态资源：Servlet，JSP等，负责逻辑处理

数据库：负责存储数据

HTTP协议：定义通信规则

Web服务器：负责解析HTTP协议，解析请求数据，并发送响应数据

HTTP

HyperText Transfer Protocol，超文本传输协议，规定了浏览器金额服务器之间数据传输的规则。

HTTP协议特点：

1.基于TCP协议：面向连接，安全

2.基于请求——响应模型的：一次请求对应一次响应

3.HTTP协议是无状态的协议：对于事务处理没有记忆能力，每次请求响应都是独立的

缺点：多次请求不能共享数据，java中使用会话技术（Cookie，Session）来解决这个问题

优点：速度快

HTTP请求数据格式

请求数据分为3部分：

1.请求行：请求数据的第一行，其中GET表示请求方式，/表示请求资源路径，HTTP/1.1表示协议版本

2.请求头：第二行开始，格式为Key：value形式

3.请求体：Post请求的最后一部分，存放请求参数

常见的Http请求头：

Host：表示请求的主机名

User-Agent：浏览器版本，例如Charome浏览器的标识类似Mozilla/sio.....Chrome/79

Accept：表示浏览器能接收的资源类型，如text/*,image/*或者*/*表示所有

Accept-Language：表示浏览器偏好的语言，服务器可以据此返回不同语言的网页

Accept-Encoding：表示浏览器可以支持的压缩类型，例如gzip，deflafe等

Get请求和Post请求的区别：

1.GET请求请求参数在请求行中，没有请求体，POST请求请求参数在请求体中

2.GET请求请求参数大小有限制，POST没有

HTTP-响应数据格式

响应数据分为3部分：

1.相应行：响应数据的第一行，其中HTTP/1.1表示协议版本，200表示响应状态码，OK表示状态码描述。

2.响应头：第二行开始，格式为key:value形式

3.响应体：最后一部分，存放响应数据

常见的HTTP响应头：

Content-Type:表示该响应内容的类型，例如text/html

Content-Length:表示该响应内容的长度（字节数）

Content-Encoding:表示该响应压缩算法，例如gzip

Cache-Control:指示客户端应如何缓存，例如max-age=300表示可以最多缓存300秒

状态码

1xx        响应中-临时状态码，表示请求已经接受，告诉客户端应该继续请求或者如果它已经完整则忽略它。

2xx        成功-表示请求已经被成功接收，处理已完成

1xx	响应中-临时状态码，表示请求已经接受，告诉客户端应该继续请求或者如果它已经完整则忽略它。
2xx	成功-表示请求已经被成功接收，处理已完成
3xx	重定向-重定向到其他地方：它让客户端再发起一个请求以完成整个处理
4xx	客户端错误-处理发生错误，责任在客户端，如：客户端的请求，一个不存在的资源，客户端未被授权，禁止访问等
5xx	服务区端错误-处理发生错误，责任在服务端，如：服务端抛出异常，路由出错，HTTP版本不支持等

Web服务器

web服务器是一个应用程序（软件），对http协议的操作进行封装，使得程序员不必直接对协议进行操作，让web开发更加便捷。主要功能是“提供网上信息浏览服务”

Web服务器的作用

封装http协议操作，简化开发

可以将web项目部署到服务器中，对外提供网上浏览服务

Tomcat

概念：是Apache软件基金会一个核心项目，是一个开源免费的轻量级Web服务器，支持Servlet/JSP少量JavaEE规范。

Tomcat也被称为Web容器，Servlet容器，Servlet需要依赖于Tomcat才能运行

基本使用

控制台中文乱码：修改conf/logging.properties

关闭：

1.直接x掉运行窗口：强制关闭

2.bin\shutdown.bat:正常关闭

3.Ctrl + C:正常关闭

配置

1.修改启动端口号：conf/server.xml

<connector port ="8080" protocol = "HTTP/1.1"
    connectionTimeout="2000"
    redirectPort="8443"/>

注意：

Http协议默认端口号为80，如果将Tomcat端口号改为80，则将来访问Tomcat时，将不用输入端口号

启动时可能出现的问题：

1.端口号冲突：找到对应程序，将其关闭

2.启动窗口一闪而过：检查JAVA_HOME环境变量是否正确配置。

Tomcat-部署项目

将项目放置到webapps目录下，即部署完成。

一般javaweb项目会被打成war包，然后将war包放到webapps目录下，Tomcat会自动解压缩war文件。

IDEA中使用Tomcat--集成本地Tomcat

将本地Tomcat集成到IDEA中，然后进行项目部署即可。

IDEA中使用Tomcat--Tomcat Maven插件

1.pom.xml添加Tomcat插件

<build>
    <plugins>
        <!--Tomcat插件-->
        <plugin>
            <groupId>org.apache.tomcat.maven</groupId>
            <artifactId>tomcat7-maven-plugin</artifactId>
            <version>2.2</version>
        </plugin>
    </plugins>
</build>

Servlet

servlet是java提供的一门动态web资源开发技术

servlet是javaEE规范之一，其实就是一个接口，将来我们需要定义servlet类实现servlet接口，并由web服务器进行servlet

servlet快速入门

1.创建web项目，导入Servlet依赖坐标

<dependency>
    <groupId>javax.servlet</groupId>
    <artifactId>javax.servlet-api</artifactId>
    <version>3.1.0</version>
    <scope>provided</scope>
</dependency>

2.创建：定义一个类，实现servlet接口，并重写接口中所有方法，并在service方法中输入一句话

public class ServletDemo1 implements Servlet{
    public void service(){}
}

3.配置：在类上使用@WebServlet注解，配置该Servlet的访问路径

@WebServlet ("/demo1")
public class ServletDemo1 implements Servlet{
}

4.访问：启动Tomcat，浏览器输入URL访问该Servlet

Servlet执行流程

1.Servlet有谁创建？Servlet方法由谁调用？

Servlet由web服务器创建，Servlet方法由web服务器调用

2.服务器怎么知道Servlet中一定有Service方法

因为我们自定义的Servlet必须实现Servlet接口并重写其方法，而Servlet接口中哟哟Service方法。

Servlet生命周期

对象的生命周期指一个对象从被创建到被销毁的整个过程。Servlet运行在Servlet容器（web服务器）中，其生命周期由容器来管理，分为4个阶段：

1.加载和实例化

默认情况下，当Servlet第一次被访问时，由容器创建Servlet对象

@WebServlet(urlPatterns = "/demo", loadOnStartup=1)

        负整数：第一次被访问时创建Servlet对象

        0或正整数：服务器启动时创建Servlet对象，数字越小优先级越高

2.初始化

在Servlet实例化之后，容器将调用Servlet的init()方法初始化这个对象，完成一些如加载配置文件、创建连接等初始化的工作，该方法只调用一次。

3.请求处理：每次请求Servlet时，Servlet容器就会调用Servlet的Service()方法对请求进行处理。

4.服务终止：当需要释放内存或者容器关闭时，容器就会调用Servlet实例的destroy()方法完成资源的释放。在destory()方法调用之后，容器会释放这个Servlet实例，该实例随后会被java的垃圾收集器所回收。

Servlet方法介绍

初始化方法，在Servlet被创建时执行，只执行一次

        void init（ServletRequest reg，ServletResponse res）

提供服务方法，每次Servlet被访问，都会调用该方法

        void service（ServletRequest reg，ServletResponse res）

销毁方法，当Servlet被销毁时，调用该方法，在内存释放或服务区关闭时销毁Servlet

        void destory（）

获取ServletConfig对象

        ServletConfig getServletConfig()

获取Servlet信息

        String getServletInfo()

Servlet体系结构

I：Servlet	Servlet体系根接口
C：GenericServlet	Servlet抽象实现类
C：HttpServlet	对HTTP协议封装的Servlet实现类

我们将来开发B/S构架的web项目，都是针对HTTP协议，所以我们自定义Servlet，会继承HttpServlet，有doGet()方法，doPost()方法

Servlet的service方法

public void service(ServletRequest req, ServletResponse res) throw ServletException,IOException{
    //根据请求方式的不同，进行分别的处理
    HttpServletRequest request = (HttpServletRequest) req;
    //1.获取请求方式
    String method = request.getMethod();
    //2.判断
    if("GET".equals(method)){
        //get方式的处理逻辑
    }else if ("POST".equals(method)){
        //post方式的处理逻辑
    }
}

可以将上述代码封装成MyHttpServlet类，别人用时直接继承。HttpServlet就是这样做的

1.HttpServlet中为什么要根据请求方式的不同，调用不同的方法？

get和post请求消息不同，需要去分别处理。

2.如何调用

获取请求方式，判断后做出不同的处理逻辑

Servlet urlPattern配置

Servlet要想被访问，必须配置其访问路径（urlPattern）

1.一个Servlet，可以配置多个urlPattern

@WebServlet（urlPatterns = {"/demo1","/demo2"}）

2.urlPattern配置规则

①精确匹配

@WebServlet（"/user/select"）

②目录匹配

@WebServlet（"/user/*"）

③扩展名匹配

@WebServlet（"*.do"）

④任意匹配

@WebServlet（"/"）

@WebServlet（"/*"）

优先级：

精确路径>目录路径>扩展名路径>/*>/

当我们道德项目中的Servlet配置了"/",会覆盖掉Tomcat中的DefaultServlet，当其他的url-pattern都匹配不上时都会走这个Servlet，当我们的项目中配置了"/*"，意味着匹配任意访问路径。

xml配置方式编写Servlet

Servlet从3.0版本后开始支持使用注解配置，3.0版本前只支持xml配置文件的配置方式。

步骤：

1.编写Servlet类

2.在web.xml中配置该Servlet

<!--Servlet全类名-->
<servlet>
    <servlet-name>demo13</servlet-name>
    <servlet-class>com.itheima.web.ServletDome13</servlet-class>
</servlet>

<!--Servlet访问路径-->
<servlet-mapping>
    <servlet-name>demo13</servlet-name>
    <url-pattern>/demo13</url-pattern>
</servlet-mapping>

Request（请求）和Response（响应）

Request:获取请求数据

        使用request对象，获取请求数据

        request.getParameter("name")

Response:设置响应数据

        使用response对象，设置响应数据

        response.setHeader("...","...");

        response.getWriter().write("<h1>" + name + ",....<h1>");

Request继承体系

ServletRequest  --->  java提供的请求对象根接口

        ↑

HttpServletRequest  --> java提供的对http协议封装的请求对象接口

        ↑

RequestFacade  -->   Tomcat定义的HttpServletRequest的实现类

1.Tomcat需要解析请求数据,封装为request对象，并且创建request对象传递到service方法中

2.使用request对象，查阅javaEE API文档的HttpServletRequest接口

Request获取请求数据

请求数据分为3部分

1.请求行：GET/request-demo/req1?username=zhangsan HTTP/1.1

String getMethod()：获取请求方式：GET

String getContextPath():获取虚拟目录（项目访问路径）/request-demo  （动态获取）

StringBuffer getRequestURL():获取URL：http://localhost:8080/request-demo/req1

String getRequsetURI():获取URI（统一资标识符）:/request-demo/req1

String getQueryString():获取请求参数（GET方式）:username=zhangsan&password=123

2.请求头：User-Agent:Mozilla/5.0 Chorme /91.0.4472.106

String getHeader(String name)：根据请求头名称，获取值

3.请求体： username = superbaby & password =123

ServletInputStream getInputStream():获取字节输入流

BufferedReader getReader():获取字符输入流

Request通用方式获取请求参数

请求参数获取方式：

GET方式：

String getQueryString()

POST方式：

BufferedReader getReader()

GET请求方式和POST请求方式区别主要在于获取请求参数的方式不一样，其他都一样，可以共用。

//获取请求方式
String method = request.getMethod();
//判断
if("GET".equals(method)){
    //get方式获取请求参数
    params = this.getQueryString();
}else if ("POST".equals(method)){
    //post方式获取请求参数
    BufferedReader reader = this.getReader();
    params = reder.readLine();
}
//后面写相同的方法

Map<String,String[]> getParameterMap():获取所有参数Map集合

String[] getParameterValues(String name):根据名称获取参数值（数组）

String getParameter (String name): 根据名称获取参数值（单个值）

请求参数中文乱码处理

请求参数如果存在中文数据，则会乱码

解决方案：

post:设置输入流的编码

        req.setCharacterEncoding("UTF-8");

通用方式：（GET/POST）：先编码，再解码

        new String(username.getByte("ISO-8859-1"),"UTF-8");

Tomcat8.0之后，已将GET请求乱码问题解决，设置默认的解码方式为UTF-8

URL编码：

1.将字符串按照编码方式转为二进制

2.每个字节转为2个16进制数并在前边加上%

请求转发

请求转发（forward）：一种在服务器内部的资源跳转方式。

实现方式：

req.getRequestDispatcher("资源B路径").forward(req.resp);

请求转发资源间资源共享数据：使用Request对象

void setAttribute(String name, Object 0)：存储数据到request域中

Object getAttribute(String name)：根据key，获取值

void removeAttribute(String name)：根据key，删除该键值对

请求转发特点：

浏览器地址栏路径不发生变化

只能转发到当前服务器的内部资源

一次请求，可以在转发的资源间使用request共享数据

Response继承体系

ServletResponse  --->  java提供的请求对象根接口

        ↑

HttpServletResponse  --> java提供的对http协议封装的请求对象接口

        ↑

ResponseFacade  -->   Tomcat定义的HttpServletResponset的实现类

Response设置相应数据功能介绍

响应数据分为3部分

1.响应行  HTTP/1.1 200 OK

        void setStatues(int sc)：设置响应状态码

2.响应头  Content-Type:text/html

        void setHeader(String name, String value)：设置响应头键值对

3.响应体：<html><head></head><body></body></html>

        PrintWriter getWriter()：获取字符输出流

        ServletOutputStream getOutputStream()：获取字节输出流

Response完成重定向

重定向（Redirect）：一种资源跳转方式

实现方式：

        resp.setStatus(302);

        resp.setHeader("location", "资源B的路径");

简化方式完成重定向

        response.sendRedirect("路径");

重定向特点

浏览器地址栏路径发生变化

可以重定向到任意位置的资源（服务器内部、外部均可）

两次请求，不能在多个资源使用request共享数据

路径问题

浏览器使用：需要加虚拟目录（项目访问路径）

服务器使用：不需要加虚拟目录

Response响应字符数据

1.通过Response对象获取字符输出流

        PrintWriter writer = resp.getWriter();

2.写数据

        writer.write("aaa");

在最上面写response.setContentType("text/html;charset=utf-8");

                可识别html语言，设置编码方式

注意：

该流不需要关闭，随着响应结束，response对象销毁，由服务器关闭

中文数据乱码：原因通过Response获取的字符输出流默认

        编码：ISO-8859-1

Response响应字节数据

1.通过Response对象获取字符输出流

        ServletOutputStream outputStream = resp.getOutputStream();

2.写数据

        outputStream.write(字节数据);

IOUtils工具类使用

1.导入坐标

<dependency>
    <groupId>commons-io</groupId>
    <artifactId>commons-io</artifactId>
    <version>2.6</version>
</dependency>

2.使用

IOUtils.copy(输入流，输出流);

JSP

java服务端页面（Java Server Pages）：一种动态的网页技术，其中既可以定义HTML、JS、CSS等静态内容，还可以定义java代码的动态内容。

        JSP = HTML + JAVA

jsp的作用：简化开发，避免了在Servlet中直接输入HTML标签

JSP快速入门

1.导入JSP坐标

<dependency>
    <groupId>javax.servlet.jsp</groupId>
    <artifactId>jsp-api</artifactId>
    <version>2.2</version>
    <scope>provided</scope>
</dependency>

2.创建jsp文件

3.编写HTML标签和java代码

<body>
    <h1>hello jsp~</h1>
    <%System.out.printf("jsp,hello");%>
</body>

JSP原理

本质上就是一个Servlet

JSP在被访问时，由jsp容器（Tomcat）将其转换为java文件（Servlet），再由JSP容器（Tomcat）将其编译，最终对外提供服务的其实就是这个字节码文件

JSP脚本

JSP脚本用于JSP页面内定义java代码

JSP脚本分类

1.<%......%>内容会直接放到_jspService()方法之中

2.<%=...%>内容会放到out.print()中，作为out.print()的参数

3.<%!...%>内容会放到_jspService()方法之外，被类直接包含

JSP缺点

由于JSP页面内，既可以定义HTML标签，又可以定义java代码，造成了以下问题：

1.书写麻烦：特别是复杂的页面

2.阅读麻烦

3.复杂度高：运行需要依赖于各种环境，JRE、JSP容器、JavaEE...

4.占内存和磁盘：JSP会自动生成.java和.class文件占磁盘，运行的是.class文件占内存

5.调试困难：出错后，需要找到自动生成的.java文件进行调试

6.不利于团队协作：前端人员不会java，后端人员不精HTML

JSP已逐渐退出历史舞台→HTML + AJAX

Servlet  →  JSP  →  Servlet + JSP  →  Servlet + HTML + AJAX

Servlet + JSP

Servlet：逻辑处理，封装数据

JSP：获取数据，遍历展现数据

不要直接在JSP里写java代码：EL表达式：替换获取数据的代码，JSTL标签：替换循环遍历代码

EL表达式

Expression Language 表达式语言，用于简化JSP页面内的java代码

主要功能：获取数据

语法：${expression}

${brands}:获取域中存储的key为branks的数据

javaWeb中的四大域对象

1.page：当前页面有效

2.request：当前请求有效

3.session：当前会话有效

4.application：当前应用有效

EL表达式获取数据，会依次从这4个域中寻找，直到找到为止

JSTL标签

JSP标准标签库（JSP Standarded Tag Library），使用标签取代JSP页面上的java代码

<c:if>与我们在一般程序中的if一样

<c:forEach>基础迭代标签，接受多种集合类型

<c:if test="${flag==1}">
    男
</c:if>
<c:if test="${flag==2}">
    女
</c:if>

JSTL快速入门

1.导入坐标

<dependency>
    <groupId>jstl</groupId>
    <artifactId>jstl</artifactId>
    <version>1.2</version>
</dependency>
<dependency>
    <groupId>taglibs</groupId>
    <artifactId>standard</artifactId>
    <version>1.1.2</version>
</dependency>

2.在jsp页面上引入JSTL标签库

<%@taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core"%>

3.使用

<c:forEach items="${brands}" var="brand">
    <tr alingn ="center">
        <td>${brand.id}</td>
        <td>${brand.brandName}</td>
        <td>${brand.companyName}</td>
        <td>${brand.description}</td>
    </tr>
</c:forEach>

相当于for循环

items：被遍历的容器

varStatus：遍历状态对象

var：遍历产生的临时变量

for(Brand brand : brands){
    Integer id = brand.id;
    ....
   
}

普通for循环

begin：开始数

end：结束数

step：步长

<c:forEach begin = "0" end = "10" step = "1" var = "i">
    ${i}
</c:forEach>

for(int i=0; i<=10; i++){
    System.out.printf(i);
}

MVC模式

MVC是一种分层开发的模式（开发模式，宏观概念），其中：

m：model，业务模型，处理业务

v：view，视图，界面展示

c：controller：控制器，处理请求，调用模型和视图

MVC好处

职责单一，互不影响

有利于分工协作

有利于组件重用

三层架构（软件设计架构）

数据访问层：对数据库的CRUD基本操作

业务逻辑层：对业务逻辑进行封装，组合数据访问层中基本功能，形成复杂的业务逻辑功能

表现层：接受请求，封装数据，调用业务逻辑层，响应数据

表现层框架：SpringMVC/Struts2

业务逻辑层框架：Spring

数据访问层框架：MyBatis/Hibername

MVC模式和三层架构

会话追踪技术

会话：用户打开浏览器，访问web服务器的资源，会话建立，直到有一方断开连接，会话结束。在一次会话中可以包含多次请求。

会话追踪：一种维护浏览器状态的方法，服务器需要识别多次请求是否来自于同一浏览器，以便在同一次会话的多次请求间共享数据。

HTTP协议是无状态的，每次浏览器向服务器请求时，服务器都会将该请求视为新的请求，因此我们需要会话跟踪技术来实现会话内数据共享。

实现方式

1.客户端会话跟踪技术：Cookie

2.服务端会话跟踪技术：Session

Cookie基本使用

Cookie：客户端会话技术，将数据保存到客户端，以后每次请求都携带Cookie数据进行访问。

1.创建Cookie对象，设置数据

Cookie cookie = new Cookie("key", "value");

2.发送Cookie到客户端，使用request对象

request.addCookie(cookie);

3.获取客户端携带的所有Cookie，使用request对象

Cookie[] cookies = request.getCookies();

4.遍历数组，获取每一个Cookie对象：for

5.使用Cookie对象方法获取数据

cookie.getName();

cookie.getValue();

Cookie原理

cookie的实现是基于HTTP协议的

响应头：set-cookie

请求头：cookie

Cookie存活时间

默认情况下，Cookie存储在浏览器内存中，当浏览器关闭，内存释放，则cookie被销毁

setMaxAge(int seconds)：设置Cookie存活时间

1.正数：将Cookie写入浏览器所在电脑的硬盘，持久化存储，到时间自动删除

2.负数：默认值，Cookie在当前浏览器内存中，当浏览器关闭，则Cookie被销毁

3.零：删除对应Cookie

Cookie存储中文

Cookie不能直接存储中文，如需存储，则需要进行转码：URL编码

Session

服务端会话跟踪技术：将数据保存到服务器

JavaEE提供HTTPSession接口，来实现一次会话的多次请求间数据共享功能。

1.获取Session对象

HttpSession session = request.getSession();

2.session对象功能：

        void setAttribute(String name, Object o)：存储数据到session域中

        Object getAttribute(String name)：根据Key，获取值

        void removeAttribute(String name)：根据Key，删除该键值对

Session原理

Session是基于Cookie实现的

Session使用细节：

        Session钝化、活化：

        服务器重启后，Session中的数据是否还在？

        钝化：在服务器正常关闭后，Tomcat会自动将Session数据写到硬盘的文件中。

        活化：再次启动服务器后，从文件中加载数据到Session中

Session销毁

        默认情况下，无操作，30分钟自动销毁

<session-config>
    <session-timeout>30</session-timeout>
</session-config>

调用Session对象的invalidate（）方法

Cookie和Session都是来完成一次会议内多次请求间数据共享的

区别

存储位置：Cookie是将数据存储在客户端，Session将数据存储在服务器端

安全性：Cookie不安全，Session安全

数据大小：Cookie最大3KB，Session无大小限制

存储时间：Cookie可以长时间存储，Session默认30分钟

服务器性能：Cookie不占服务器资源，Session占用服务器资源

Filter

概念

Filter表示过滤器，是javaWeb三大组件（Servlet、Filter、Listener）之一

过滤器可以把对资源的请求拦截下来，从而实现一些特殊的功能。

过滤器一般完成一些通用的操作，比如：权限控制、同一编码处理、敏感字符处理等等

Filter使用步骤

1.定义类，实现Filter接口，并重写其所有方法

public class FilterDemo implements Filter{
    public void init(FiterConfig filterConfig)
    public void doFilter(ServletRequest request, ServletResponse response)
    public void destroy(){}
}

2.配置Filter拦截资源的路径：在类上定义@WebFilter注解

3.在doFilter方法中输入一句话，并放行

public void doFilter(ServletRequest request, ServletResponse response){
    System.out.println("filter被执行了")
    chain.doFilter(request, response);
}

Filter执行流程

执行放行前逻辑 → 放行 → 访问资源 → 执行放行后逻辑

Filter拦截路径配置

Filter可以根据需求，配置不同的拦截资源路径

@WebFilter("/*")

public class FilterDemo

拦截具体的资源：/index.jsp：只有访问index.jsp时才会被拦截

目录拦截：/user/*：访问/user下的所有资源，都会被拦截

后缀拦截：*.jsp：访问后缀名为jsp的资源，都会被拦截

拦截所有：/*：访问所有资源，都会被拦截

过滤链

一个Web应用，可以配置多个过滤器，这多个过滤器称为过滤链。

注解配置的Filter，优先级按照过滤器类名（字符串）的自然排序

Listener

概念

Listener表示监听器，是javaWeb三大组件（Servlet、Filter、Listener）之一

监听器可以监听就是在application，session，request三个对象创建、销毁或者往其中添加修改删除属性时自动执行代码的功能组件。

Listener分类

JavaWeb中提供了8个监听器

监听器分类	监听器名称	作用
ServletContext监听	servletContextListener	用于对ServletContext对象进行监听(创建、销毁)
	servletContextAttributeListener	对ServletContext对象中属性的监听(增删改属性)
session监听	HttpSessionListener	对Session对象的整体状态的监听(创建、销毁)
	HttpSessionAttributeListener	对Session对象中的属性监听（增删改属性)
	HttpSessionBindingListener	监听对象于Session的绑定和解除
	HttpSessionActivationListener	对Session数据的钝化和活化的监听
Request监听	servletRequestListener	对Request对象进行监听(创建、销毁)
	ServletRequestAttributeListener	对Request对象中属性的监听 (增删改属性)

ServletContextListener使用

1.定义类，实现ServletContextListener接口

public class ContextLoaderListener implements ServletContextListener{
    //ServletContext对象被创建：整个Web应用发布成功
    public void contextInitialized(ServletContextEvent sce){}
    //ServletContext对象被销毁：整个Web应用卸载
    public void contextDestroyed(ServletContextEvent sce){}

}

2.在类上添加@WebListener注解

AJAX

概念

AJAX(Asynchronous JavaScript And XML)异步的JavaScript和XML

作用

1.与服务器进行数据交换：通过AJAX可以给服务器发送请求，并获取服务器响应的数据。

使用了AJAX和服务器进行通信，就可以使用HTML+AJAX来替换JSP页面了

2.异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术。

AJAX步骤

1.编写AjaxServlet，并使用response输出字符串

2.创建XMLHttpRequest对象：用于和服务器交换数据

var xmlhttp;

if (window.XMLHttpRequest){

        xmlhttp = new XMLHttpRequest();

} else {

        xmlhttp = new ActiveXObject("Mircrosoft.XMLHTTP");

}

3.向服务器发送请求

xmlhttp.open("GET", "url");
xmlhttp.send();

4.获取服务器响应数据

xmlheep.onreadystatechange = function(){
    if(xmlhttp.readyState == 4 && xmlhttp.readyState == 200){
        alert(xmlhttp.responseText);
    }

}

AXios异步框架

AXios对原生的AJAX进行封装，简化书写

AXios快速入门

1.引入AXios的js文件

<script src = "js/axios-0.18.0.js"></script>

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);
})

AXios请求方式别名

为了方便起见，AXios已经为所有支持的请求方法提供了别名

get(url)

axios.get("url")
    .then(function (resp){
        alert(resp.data);
});

post(url,请求参数)

axios.post("url","参数")
    .then(function (resp){
        alert(resp.data);
});

JSON

概念

JavaScript对象表示法（JavaScript Object Notation ）

由于其语法简单，层次结构鲜明，现多用于作为数据载体，在网络中进行数据传输。

JavaScript对象

{
    name : "zhangsan",
    age : 23,
    city : "北京"
}
//键可带""可不带

JSON

{
    "name" : "zhangsan",
    "age" : 23,
    "city" : "北京"
}

JSON基本语法

var 变量名 = {"key1" : value1,
              "key2" : value2,
              .....
};

获取数据：

变量名.key

value的数据类型

数字（整数或浮点数）

字符串（在双引号中）

逻辑值（true或false）

数组（在方括号中）

对象（在花括号中）

null

JSON数据和java对象转换

请求数据：JSON字符串转为java对象

响应数据：java对象转为JSON字符串

Fasjson是阿里巴巴提供的一个java语言编写的高性能功能完善的JSON库，是目前Java语言中最快的json库，可以实现java对象和JSON字符串的相互转换。

使用步骤

1.导入坐标

<dependency>
    <groupId>com.alibaba</groupId>
    <artifactId>fastjson</artifactId>
    <version>1.2.62</version>
</dependency>

2.java对象转JSON

String jsonStr = JSON.toJSONString(obj);

3.JSON字符串转java对象

User user = JSON.parseObject(jsonStr, User.class);

VUE

vue是一套前端框架，免除原生JavaScript中的DOM操作，简化书写。

基于MVVM(Model-View-viewModel)思想，实现数据的双向绑定，将编程的关注点放在数据上。

MVC：只能实现模型到视图的单项展示

MVVM：可以实现数据的双向绑定

VUE快速入门

1.新建HTML页面，引入Vue.js文件

<script src = "js/vue js"></script>

2.在js代码区域，创建Vue核心对象，进行数据绑定

new Vue({
    el:"#app",
    data(){
        return{
            username:""
        }
    }
})

3.编写视图

<div id = "app">
    <input name = "username" v-model="username">
    {{username}}<!--插值表达式-->
</div>

Vue常用指令

v-bind	为HTML标签绑定属性值，如设置href，css样式等（v-bind可省略）
v-model	在表单元素上创建双向数据绑定
v-on	为html标签绑定事件v-on:click="show()"   等价于  @click="show()"
v-if	条件性的渲染某元素，判定为true时渲染，否者不渲染
v-else
v-else-if
v-show	根据条件展示某元素，区别在于切换的是display属性的值
v-for	列表渲染，遍历容器的元素或者对象的属性

<div v-for = "addr in addrs">
    {{addr}}<br>
</div>

<!--加索引-->
<div v-for = "(addr,i) in addrs">
    <!--i表示索引，从0开始-->
    {{i+1}}:{{addr}}<br>
</div>

Vue生命周期

生命周期的八个阶段：每触发一个生命周期事件，会自动执行一个生命周期方法（钩子）

状态	阶段周期
beforeCreate	创建前
create	创建后
beforeMount	载入前
mounted	挂载完成
beforeUpdate	更新前
updated	更新后
beforeDestroy	销毁前
destory	销毁后

mounted：挂载完成，Vue初始化成功，html页面渲染成功，发送异步请求，加载数据。

Element

Element：是饿了么公司前端开发团队提供的一套基于Vue的网站组件库，用于快速构建网页

组件：组成网页的部件，例如超链接、按钮、图片、表格等等

Element快速入门

1.引入Element的css.js文件和Vue.js

<script src = "vue.js"></script>
<script src = "element-ui/lib/index.js"></script>
<link rel = "stylesheet" href = "element-ui/lib/theme-chalk/index.css">

2.创建Vue核心对象

<script>
    new Vue({
        el:"#app"
    })
</script>

3.官网复制Element组件代码

Element布局

Element中有两种布局方式：

Layout布局：通过基础的24分栏，迅速简便地创建布局。

Container布局容器：用于布局的容器组件，方便快速搭建页面的基本结构。