AJAX---

1.安装express创建服务器端

npm i express

const express =require("express") //引入
const ex=express()//创建应用对象

//创建路由规则，request是对请求报文的监听，response是对响应报文的监听
ex.get('/',(request,response)=>{
    //设置响应头，允许跨域
    response.setHeader('Access-Control-Allow-Origin','*')
    //设置响应体
	response.send("hello")
})

ex.listen(8000,()=>{//监听8000端口，有人访问就将“hello”发送给她
	console.log("服务器已经启动，8000端口监听中。。。")
})

2.发送AJAX请求

发送请求需要用到XMLHttpRequest对象。这个状态有五个readystate，分别：

0：最初始的状态

1：open()方法调用

2：send()方法调用

3：服务器有返回结果

4：服务器返回全部结果

    <script>
        const btn=document.querySelectorAll("button")
        const inp=document.querySelectorAll("input")
        btn[0].addEventListener('click',function(){
            const xhr=new XMLHttpRequest()
            xhr.open("GET","http:127.0.0.1:8000/")
            xhr.send()
            xhr.onreadystatechange=function(){
                if(xhr.readyState===4){
                    if(xhr.status>=200&&xhr.status<300){
                        console.log(xhr.status)//状态码200
                        console.log(xhr.statusText)//状态字符串ok
                        console.log(xhr.getAllResponseHeaders)//整个响应头
                        console.log(xhr.response)//响应体""hello AJAX"
                        //修改页面，页面不会刷新
                        inp[0].value=xhr.response
                    }
                }
            }
        })
    </script>

3.设置请求体内容：post请求，可以带参数

send的参数内容为请求体

 服务器端要有 对应处理post请求的。

4.设置请求头内容：一般关于用户的身份校验放在请求头

 此时后台需要做响应的响应处理

 5.接收服务器的json数据

只能传输字符串和buffer内容，所以需要把json对象转换成string（JSON.stringify ）

在客户端，需要把字符串重新转换成json，两种方式：手动、自动

手动：

自动： 

 

 

 6.为解决IE缓存问题（发送的请求与之前一样，则会将之前缓存的数据拿出来用，而不会再次联系服务器发数据），需要给请求地址加上当前时间的时间戳

 7.超时和网络异常的处理

 8.手动取消请求

9. 解决请求重复发送问题（设置标识变量）

 10.发送AJAX请求的方式：jQuery、axios、fetch

 11.解决跨域问题

1)JSONP，只支持get请求。利用script标签的跨域能力来发送请求的。

 利用前端的函数，将参数返回，并在前端做处理：

 2)CORS,支持get、post

12.源码在B站视频