初步认识
1.什么是Ajax
Ajax的全称是Asynchronous Javascript And XML(异步JavaScript和XML)。
通俗的理解:在网页中利用XMLHttpRequest对象和服务器进行数据交互的方式，就是Ajax。
主要用途:Ajax能让我们轻松实现网页与服务器之间的数据交互 可以局部获取新的数据 不会发生网页的跳转
异步地向服务器发送请求，在等待响应的过程中，不会阻塞当前页面，在这种情况下，浏览器可以做自己的事情。直到成功获取响应后，浏览器才开始处理响应数据。
1.1原始的ajax请求(XmlHttpRequest对象)
分为四个步骤解析:
1.第一步：创建网络请求的AJAX对象（使用XMLHttpRequest）可以看成是一个实例对象
2.第二步：利用函数监听XMLHttpRequest对象状态的变化
3.第三步:配置网络请求（通过open方法）第一个参数 请求方式 第二个参数 请求的地址； 第三个参数 是否是异步请求:boolean值一般省略
4.第四步:发送send网络请求； (额外补充全部的数据都放置在xhr这个单一对象里)
1.2xhr.readyState的状态解析
0：初始化，XMLHttpRequest对象还没有完成初始化 1：载入，XMLHttpRequest对象开始发送请求 2：载入完成，XMLHttpRequest对象的请求发送完成 3：解析，XMLHttpRequest对象开始读取服务器的响应 4：完成，XMLHttpRequest对象读取服务器响应结束
1.3常见的Http的状态码的解析
- 200:客户端请求成功
- 201:POST请求 创建新的资源
- 301:请求的URL已经被修改,而新的URL会显示在响应里
- 400:客户端出现错误
- 500:服务端出现错误
1.4json数据的序列化和反序列化
序列化:把字符串数据转化为json数据形式
反序列化:把json数据转化为字符串数据
get请求
URL地址后面直接接查询字符串 query形式用?key=value&key=value的形式
post请求
关键点:1.设置响应数据的类型(一般都是json形式) 2.设置请求体的类型信息设置 进行如何编码解析 可以有多种处理形式
深入理解
1.内部ajax函数式的封装
内部可以传入对应的URL地址 方法 请求体 成功的回调 失败的回调 特别注意区分请求是get请求 还是post请求 post请求后面携带的是请求体
ajax的二次封装
在大型的项目中,因为对应的后台服务器可能不止一台,所以一般可以创建多个实例对象来进行配置 下面是几个注意点
- 配置通用的基础路径和超时
- 显示请求进度条
- 成功返回的数据不再是response, 而直接是响应体数据response.data
- 统一处理请求错误, 具体请求也可以选择处理或不处理
- 配置请求拦截器 进度条的展现 内部一定记得返回config 后续会根据这个携带的信息 发送请求
- 配置响应拦截器 进度条的取消 对于请求失败的统一处理情况 这里涉及到promise的理解情况(看最终的返回值)
