http协议&会话

    http协议
         第一步：建立连接
    客户端和服务器之间需要通信才能相互传达信息，所以双方之间第一步需要建立连接
    当客户端跟服务器之间进行连接的时候，它们需要知道双方的一些信息
    一般来说都是客户端先向服务器发起连接信息，这个过程经历了"三次握手"
     第一次：客户端向服务器发送一个信息，服务器收到这个信息，双方之间就可以知道一些事情
        客户端向服务器发送一个消息，客户端就知道自己可以发送消息
        客户端向服务器发送一个消息，服务器就知道自己可以接收信息
        客户端向服务器发送一个消息，服务器就知道客户端可以发送信息
    第二次： 服务端向客户端回复一个消息， 客户端接收到一个消息。 此时互相知道的消息
         服务端知道自己能发消息
         客户端知道服务端能收消息
         客户端知道服务端能发消息
         客户端知道自己能收消息
    第三次： 客户端给服务端再发一个消息， 服务端又收到一个消息。 此时， 最后一个信息， 也就确定了：
         服务端知道客户端能收消息
         这时候， 客户端和服务端就能开始通信了
    -----------------------------------------------------------------------
         第二步：开始通信(请求和响应)
    通信主要有两个过程，一个是客户端向服务器发起的请求，一个是服务器向客户端发起的响应

       请求：
    请求也称为请求报文，这个文档包含了四部分内容（请求行，请求头，请求空行，请求主体）
    请求又有两种请求：get请求和post请求

    get和post的请求行：
    POST / user HTTP / 1.1
    POST 请求方式
    / user 请求URL（ 不包含域名）
    HTTP / 1.1 请求协议版本

    get和post的请求头：
    user-agent: Mozilla/5.0 # 产生请求的浏览器信息
    accept: application/json # 表示客户端希望接受的数据类型
    Content-Type: application/x-www-form-urlencoded # 客户端发送的实体数据格式
    Host: 127.0.0.1 # 请求的主机名（IP）

    get和post的请求空行：
    请求头和请求主体之间要有一个空行。好截取内容。简而言之就是语义词空行

    get和post的请求主体：（请求主体就是请求携带的参数）
    GET 请求是没有请求体数据的
    POST 请求才有请求体数据

    post请求主体叫form data
    get请求主体叫query string paramters

    --get请求的数据：
        get请求的参数是直接放在地址栏中，以键值对形式表现，键值对之间用&隔开，键和值之间用=隔开，所有的数据在地址栏的？后面
        如：地址？键=值&键=值

    --post传递数据：
         1、 必须在send() 方法之前open() 方法之后添加头信息
         2、 post请求的参数要放在send方法中作为参数，必须是字符串（将数据以字符串形式放在send方法中， 跟地址栏中的数据格式一样）
    xhr.send('name=王五&age=666')
         3、post请求要带参数必须在send之前设置头信息。
    xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded')

    --get和post的区别：  
        1、get请求是在地址栏中显示，容易给别人看到。所以get的安全性不如post
        2、get请求在地址栏中数据的大小会收到限制，一般只有4kb。而post没有数据大小的限制
    ------------------------------------------------------
       响应：
    每一个响应，都会有响应报文（响应的说明文档），响应报文包含3部分内容：

    响应行：
    HTTP / 1.1 200 OK
    HTTP / 1.1 服务器使用的 HTTP 协议版本
    200 响应状态码
    OK 对响应状态码的简单解释

    响应头：
    Date: Jan, 14 Aug 2019 12: 42: 30 GMT# 服务器时间
    Server: Apache / 2.4 .23(Win32) OpenSSL / 1.0 .2 j PHP / 5.4 .45# 服务器类型
    Content - Type: text / html# 服务端给客户端的数据类型
    Content - Length: 11# 服务端给客户端的数据长度

    响应主体：
    hello world
     服务端给客户端的响应数据

    ------------------------------------------------------
         第三步：断开连接
    断开连接的过程称为"四次挥手"
    1. 客户端发送一个我要断开的消息给服务端
    2. 服务端接受到以后发送一个消息告诉客户端我已经进入关闭等待状态
    3. 服务端再次发送一个消息告诉客户端， 这个是我的最后一次消息给你， 当我再接受到消息的时候就会关闭
    4. 客户端接受到服务端的消息以后， 告诉服务器， 我已经关闭， 这个是给你的最后一个消息

    常见的HTTP响应状态码：

    1.  100~199： 一般我们看不到， 因为表示请求继续

    2.  200~299： 请求成功

    3.  300~399： 表示重定向
        301： 永久重定向 
        302： 临时重定向

    4.  400~499： 客户端错误 
        401： 未授权（ 你要登录的网站需要授权登录）
        403： 服务器拒绝了你的请求 -
        404： 服务器找不到你请求的 URL

    5. 500~599： 服务端错误
        500： 服务器内部错误 -
        503： 服务器当前不可用（ 过载或者维护）

    ---------------------------------------------------------------------------------------
    --会话
     客户端每次请求服务器之后都会经过三次握手四次挥手的过程，当它这过程完了之后，挥手再见了客户端跟服务器就会没有状态。所以http协议是一种无状态协议。
     但是在某些情况下就需要保留访问状态，例如在注册登录的时候，注册的用户名密码都需要到另一个页面登录。为了在其他页面能保持这种状态，就出现了会话技术。
       解决方法：把登录的数据存储在当前浏览器中，因为两次的请求都是在同一浏览器中进行，到了下次请求的时候就在浏览器中获取数据，如果能获取到就说明有存储过登录过。

    --cookie会话技术
      根据这个原理可以利用cookie。cookie属于会话技术的一种，会话技术还有session，是基于服务器。
      cookie --- 在浏览器中存储数据。cookie会话技术本质是在浏览器中开辟一个存储数据的容器，用来存储数据，可以读取数据，设置数据，删除数据。cookie是解决http无状态的问题，所以cookie必须存在http上。

    --操作cookie

       -- 设置cookie （在当前页面中设置）
    document.cookie = '键=值;expires=失效时间;path=能使用当前cookie的路径'
    分解：expires = 有效时间（因为cookie是有时效性，一般在当前页面关闭的时候就会失效，所以需要给它设置时效性）  path = 路径（cookie是分域名/ip地址存储的，在当前域名下设置的cookie别的域名无法使用.cookie是分路径存储的，当前路径下设置的cookie，只能在当前路径下使用，不过可以设置）

    var date = new Date();
    date.setTime(date.getTime() - 1000 * 60 * 60 * 8 + 8000); // 当前时间的8秒之后
    document.cookie = 'age=20;expires=' + date + ";path=/; // 斜杠代表服务器的根目录

    cookie不能一次性设置多个值，只能一次设置一个
    document.cookie = 'name=zhangsan'
    document.cookie = 'age=30'

       -- 获取cookie （在另一个页面中获取）
    var cookies = document.cookie;
    console.log(cookie);
    得到的形式是 键=值; 键=值 的形式  （分号后面会有个空格）

    获取保存在登录页面中的值对齐进行判断是否登录成功：
    思路--使用split()方法分割 分号加空格
    cookies = cookies.split(; ) //[键1=值1] [键2=值2]
    再遍历
    var username
    for(var i=0;i<cookies.length;i++){
        var brr = cookies[i].split('=')
        console.log(brr); //[键1，值1] [键2，值2]

        if(brr[0] === '键1'){
            console.log(brr[1]); //值1
            username = brr[1]
        }
    }
    再进行判断，如果username是否有值

        --删除cookie
    删除cookie就是将时间设置为过去的时间。
    var date = new Date();
    date.setTiem(date.getTime() - 1000 * 60 * 60 * 8 - 1); // 把时间设置为当前时间的上一秒
    document.cookie = 'name=zhangsan;expires=' + date;
    ---------------------------------------------------------------------------------------
    --本地存储
    本地存储也是在浏览器中开辟存储数据的空间，将数据永久性的存储在客户端上。
    --设置本地存储数据
    localStorage.setItem(键，值);
    --获取本地存储数据
    localStorage.getItem(键);
    --获取本地存储的数据条数
    localStorage.length
    --删除本地存储
    localStorage.removeItem(键)
    --清空本地存储
    localStorage.clear()

    本地存储的特点：
    1. 也是按照域名存储的
    2. 存储的值是字符串类型，如果是数字，会自动转为字符串存储
    3. 键是唯一的（有的话设置就修改，没有的话设置就增加）
    4. 很多情况下需要存储对象，存储对象要先转为字符串存储（使用`JSON.stringify()`），取出来再转为json对象（使用`JSON.parse()`）

---

---