（filter、listener和ajax）day32javaEE基础查漏补缺

1.左下角重置窗口布局。

2.多重过滤器，拦截顺序是按照xml配置的<filter-mapping>的顺序来的,谁在上面先执行谁。

3.链对象是一层一层的传递，Filterchain(链对象)

res和resp

4.拦截器里设置字符集，就不用在每个servlet里单独设置了 。

5.被拦截了，也是响应，返回200状态码

6.过滤器生命周期:

1)启动tomcat，调用inti方法，filter对象自动创建，且只创建一次

2)doFilter方法，没访问一次被拦截的资源，就会被执行一次。

3)重新部署或关闭时执行destroy方法。

7.filter没有子类

//看一下自己创建的抽象类09最后。

8.怎么放开拦截

全部拦截之后，直接在filter中来个if判断。

9.监听器有啥用（了解）

监听的是域对象变化, 对象的创建和销毁, 域对象中存储的数据变化

比如，直播在线人数 。

1）后台打印log用到

2）监听用户上线与退出，显示在线用户

10.json格式（json是一个对象，要写在js标签里面）：

最外层是[]–>数组;{}–>对象。对象格式和数组格式可以互相嵌套

注意:看到数组:[ ]就遍历,看到对象:{ }使用健获取值 。

11.建一个文件起名字为.json，ctrl+alt+L格式化，好看。

12.json和java对象的类型转换

1）map–>json和object–>json是一样的，都是键值对。

2）json最外层是字符串，所以里面的引号需要反义字符。

3）json–>集合，不能写泛型和类型转换

13.Ajax 可以使网页实现异步更新

应用场景

检查用户名是否已经被注册

省市二联下拉框联动

搜索内容自动补全联想

14.ajax底层原理概述：

类似于AIO

浏览器内置对象，ajax引擎，不用等待响应的返回，可以发送多次请求（好像开线程去访问）

ajax引擎，中间商，浏览器发起请求和服务器响应都通过ajax引擎。

浏览器发起请求–>ajax引擎 <–服务器响应

XMLHttpResquest引擎对象，简称XHR。

15.Ajax底层实现

1、Ajax访问原理
　　Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而更新页面。

2、Ajax的基本使用流程（下面的底层代码有详细内容）

创建Ajax引擎对象(XmlHttpRequest、ActiveObject)
复 写onreadystatement函数(状态码、响应状态码的使用，操作Dom对象)
发送请求（get/post，参数传递）
　3、Ajax的状态码（readyState）和响应状态码(status)
　Ajax状态码：
　　运行Ajax所经历过的几种状态，无论访问是否成功都将响应的步骤，可以理解成为Ajax运行步骤。如：正在发送，正在响应等，由 Ajax对象与服务器交互时所得 ajax.readyState：0，1，2，3，4
　　0 -(未初始化)还没有调用send()
　　1 - (载入)已调用send()方法，正在发送请求
　　2 - (载入完成)send()方法执行完成
　　3 - (交互)正在解析响应内容
　　4 - (完成)响应内容解析完成，可以在客户端调用了对于上面的状态，其中“0”状态是在定义后自动具有的状态码值，而对于成功访问的状态（得到信息）我们大多数采用“4”进行判断。
　　这就是我们在使用Ajax时为什么采用下面的方式判断所获得的信息是否正确的原因。
　　if(ajax.readyState == 4 && ajax.status == 200) { console.log(‘sucess’);}

Ajax响应状态码：
　　无论Ajax访问是否成功，由http协议根据所提交的信息，服务器所返回的http头信息代码，该信息使用“ajax.status”所获得（常见的是200成功，404页面找不到）
　　总的来说：status体现的是服务器对请求的反馈，而readystate表明客户端与客户的交互状态过程。
原文链接：https://blog.csdn.net/qq_41055045/article/details/84927080

16.Ajax过程：

（1）、创建XMLHttpResquest对象，也就是创建一个异步调用对象。

（2）、创建一个新的HTTP请求，并确定该HTTP请求的方法（post/get）、URL（文件在服务器上的位置，相对位置或绝对位置）和async（ture异步/false不异步）。

（3）、设置响应HTTP请求状态变化的函数。

（4）、发送HTTP请求

（5）、获取异步调用返回的数据

（6）、使用JS和DOM实现页面局部刷新

//创建XMLHttpResquest对象
var xmlHttp = new XMLHttpRequest();   
 
//创建一个Http请求，（method,url,async)
xmlHttp.open('GET','demo.php','true'); 
    
//发送Http请求 
xmlHttp.send();
 
 
//当async为false时数据处理
document.getElementById("mydiv").innerHTML=xmlhttp.responseText;
 
 
//异步时，没有得到服务器响应的情况下，防止代码停止的方法。 （同步不需要设置此方法
//当异步时，即async为ture时数据处理，接收到服务端响应时触发
 xmlhttp.onreadystatechange=function () {
      if(xmlhttp.readyState==4&&xmlhttp.status==200){
            document.getElementById("mydiv").innerHTML=xmlhttp.responseText;
       }else{
            //没有响应的代码
       }
 }
 

原文链接：https://blog.csdn.net/qq_41261490/article/details/88871004

17…then()方法的意思和用法

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZHREfRrq-1641366286117)(C:\Users\xiu\AppData\Roaming\Typora\typora-user-images\1641307849895.png)]
原文链接：https://blog.csdn.net/qq_42363090/article/details/112180068

18.ajax请求时必须用json对象响应吗?

不是

19.js资源可以引用多次。

20.前端每写一行测试一下

21.js版本一定要改成6，语法检验。

22.HTTP请求状态码为400时的原因

出现这个请求无效说明请求没有进入后台服务器里
原因：(自己原因：路径写错了后面加了一个"}")
（1）前端提交的字段名称或者字段类型和后台的实体类不一样 或者前端提交的参数跟后台需要的参数个数不一致，导致无法封装
（2）前端提交到后台的数据应该是JSON字符串类型，而前端没有将对象转化为字符串类型；
解决方法： 对照字段名称，类型保证一致
原文链接：https://blog.csdn.net/chen_heng_Ali/article/details/111474793

23.FilterChain，过滤器链对象，所有过滤器公用一个

服务器解析请求路径时，会创建它，

24.FilterChain的生命周期是什么？？？

25.FilterConfig 类

FilterConfig 类见名知义，它是 Filter 过滤器的配置文件类。 Tomcat 每次创建 Filter 的时候，也会同时创建一个 FilterConfig 类，这里包含了 Filter 配置文件的配置信息。
FilterConfig 类的作用是获取 filter 过滤器的配置内容
1、获取 Filter 的名称 filter-name 的内容
2、获取在 Filter 中配置的 init-param 初始化参数
3、获取 ServletContext 对象
原文链接：https://blog.csdn.net/qq_44667083/article/details/108295792

26.怎么对响应进行过滤？？？

27.500错误

自己老把form表单，写成from表单（真醉了）！！！

一定要记住！！！

28.ajax的应用场景

1）检查用户名是否已经被注册

2）省市二联下拉框联动

3）内容自动补全

29.js中事件绑定3种方法

1）嵌入dom

<button onclick="open()">按钮</button>

<script>
function open(){
	alert(1)
}
</script>

这样做很是不好，有下列两大缺点，这也是如今在开发中很难见到这样绑定事件的原因。
（1）存在一个时差问题，因为用户可能会在HTML元素一出现在页面上就触发相应的事件，但当时的事件处理程序有可能尚不具备执行条件（比如js代码还没有下载下来），由此会引发错误。

（2）HTML与js代码紧密耦合。如果要更换事件处理程序，就要改动两个地方:HTML代码和JS代码，这非常不利于后期代码的维护。

2）直接绑定

<button id="btn">按钮</button>
<script>
document.getElementById('btn').onclick = function(){
	alert(1)
}
</script>
种做法的优点是：简单和所有浏览器都支持。

缺点是：只能给该元素绑定一个事件。于是出现DOM2级事件处理程序

3）事件监听

<button id="btn">按钮</button>
<script>
document.getElementById('btn').addEventListener('click',function(){
	alert(1)
})
//兼容IE
document.getElementById('btn').attachEvent('click',function(){
	alert(1)
})
</script>

第一个参数：事件名称

第一个参数：作为事件处理程序的函数

第一个参数：捕获值false(不捕获)/true(捕获),不写表示默认值false