http三次握手和四次挥手and Ajax详情

五层网络模型

1. 物理层：主要作用是定义物理设备如何传输数据（光缆，网线）
2. 数据链路层：为通讯实体间建立数据链路连接
3. 网络层：为数据在节点之间传输创建逻辑链路
4. 传输层：数据的传输都是在这层定义的，数据过大分包，分片
5. 应用层：为应用软件提供了很多服务，构建于协议之上。

HTTP工作的原理

1. 首先客户端和服务端先建立连接(TCP三次握手)
2. 发送HTTP请求
3. 服务器接受请求并返回HTTP响应
4. 客户端收到响应后断开连接(TCP四次挥手)
5. 客户端浏览器解析HTML内容

HTTP三次握手

• 第一次握手：相当于我给你发送“在吗？”，此时我什么都不知道，你知道我发送是正常的，你可以接受信息的
• 第二次握手：你回我“在！”，此时我知道自己和你收/发是正常的，你不知道自己发送是否正常。
• 第三次握手：我向你说收到，此时我知道自己收/发正常，你知道自己收/发正常

• HTTP四次挥手

• 客户端：我，服务端：你
  第一次：我向你请求，我不再发送数据了，但是还能接收
  第二次：你向我响应，你确认收到请求，但是还有数据要发送
  第三次：你向我请求，你数据发完了有时间理我了，可以关闭了
  第四次：我向你响应，我确认收到了请求，等待超时关闭；你收到响应后立即关闭

HTTP请求方法

GET、POST、PUT、DELETE、TRACE、OPTIONS、CONNECT、HEAD

Ajax简介

ajax其实就是异步的javaScript和XML。

​ XML：这是html标签，XML格式是一样的 可以自定义 满足标记语言的格式就可以了。

​ AJAX不是一门新语言，是综合HTTP异步通信 、JS、XML、以及JSON等多种网络技术的一种编程模型。

​ AJAX ~= JS+ xml+JSON + HTTP通信，本质就是在HTTP协议的基础上以异步的方式与服务器进行通信。

Ajax优点

ajax别称 叫做无刷新技术 比如地图、局部加载
​ 1.页面局部刷新。在读取数据的过程中，用户所面对的不是白屏，而是原来页面的转台，或者正在更新的信息提示状态，只有当接收到全部数据后才更新相应部分的内容，而这种更新也是瞬间的用户几乎感觉不到
​ 2.可以充分利用客户端闲置的处理能力，减轻服务器和网路传输的负担
​ 3.使web中界面与应用相分离 也可以说是数据与呈现相分离

xhr对象发送GET,POST请求

//1.创建对象
var xhr;
if (window.XMLHttpRequest){//普通浏览器    
	xhr=new XMLHttpRequest();
}else{//老版本IE
	xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
//3.监听服务器响应
xhr.onreadystatechange=function(){
    if(xhr.readyState==4&&xhr.status==200){
          console.log(xhr.responseText);//将接收到的服务器数据显示到控制台中
    }
};
//2.打开链接
xhr.open("请求方式","请求地址",是否异步:默认为异步true);
//3.5 请求头（POST请求时设置）
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//4.发送请求
xhr.send();

get传参直接在url上进行拼接
post传参的时候将参数放入send里面进行传参（注意：**填入参数时对大小写敏感，要么全大写要么全小写。）

status

表示本次请求所得到的HTTP状态码，它是一个整数

有可能有以下属性：
200, OK，访问正常
​ 301, Moved Permanently，永久移动
​ 302, Move temporarily，暂时移动
​ 304, Not Modified，未修改
​ 307, Temporary Redirect，暂时重定向
​ 401, Unauthorized，未授权
​ 403, Forbidden，禁止访问
​ 404, Not Found，未发现指定网址
​ 500, Internal Server Error，服务器发生错误

setRequestHeader()

描述：用于设置HTTP头信息。
语法：xhr.setRequestHeader(‘key’，’value’);
说明：
​ 方法必须在open()之后、send()之前被调用
​ 方法用来设置在请求发送时，一并被发送出的一些补充信息

send()

描述：用于实际发出HTTP请求。
​ 语法：xhr.send(formData);
​ 说明：send()方法的参数是表单数据，为post请求准备。 如果是get请求则参数直接写null即可。

responseText

描述：返回从服务器接收到的字符串内容，该属性为只读。
​ 如果本次请求没有成功或者数据不完整，该属性就会等于null。
​ 如果服务器返回的数据格式是JSON，就可以使用responseText属性来进行数据解析。