38协议 cookie特点及封装

38协议 cookie特点及封装

一、协议

协议，就是事先的一种约定、规则、规范、标准。

常见协议

- HTTP、HTTPS超文本传输协议
    
- FTP文件传输协议
    
- SMTP简单邮件传输协议

TCP协议

TCP/IP协议栈分为四层，每一层都有特定的协议与对方进行通信，而协议之间的通信最终都要转化为0和1的电信号，通过物理介质进行传输才能达到对方的电脑，因此物理介质是网络通信的基石

三次握手

- 建立连接时，客户端发送SYN包 (SYN=i) 到服务器，并进入到SYN-SEND状态，等待服务器确认
    
- 服务器收到SYN包，必须确认客户的SYN (ack=i+1) ，同时自己也发送一个SYN包 (SYN=k) ,即SYN+ACK包，此时服务器进入SYN-RECV状态
    
- 客户端收到服务器的SYN+ACK包，向服务器确认报ACK (ack=k+1) ，次此包发送完毕，客户端和服务器进入ESTABLISHED状态，完成三次握手，客户端与服务器开始传送数据

四次挥手

- client发送一个FIN，用来关闭client到server的数据传送，client进入FIN_WAIT_1状态
    
- server收到FIN后，发送送一个ACK给client，确认序号为收到序号+1 (与STN相同，一个FIN占用一个序号) ，server进入CLOSE_WAIT状态
    
- server发送一个FIN，用来关闭server到client的数据传送，server进入LAST_ACK状态
    
- client收到FIN后，client进入TIME_WAIT状态，接着发送一个ACK给server，确认序号为收到序号+1，server进入CLOSED状态，完成四次挥手

HTTP协议

HTTP协议即超文本传输协议，是一个 浏览器端 和 服务器端 请求和响应标准

- 常用请求方法	GET,POST
    
- 请求	请求行、请求头、请求主体
    
- 响应	状态行、响应头、响应主体

HTTP的请求协议

HTTP请求由状态行、请求头、请求正文三部分组成
    
    状态行	包括请求方式method、资源路径URL、协议版本version
    
    请求头	包括一些访问的域名、用户代理、cookie等信息
    
    请求正文	就是HTTP请求的数据

HTTP协议特点

无状态的，多次请求之间没有相关性

二、cookie

cookie的特点

- cookie中的数据可以被同一个网站的页面所共享
    
- 不同浏览器的cookie不能共享
    
- cookie的数据存储在浏览器中，每次请求服务器，在请求报文中携带cookie的数据，发送个服务器
    
- 服务器端无法直接操作cookie，是通过在服务器端设置响应头的方式，通知浏览器对coolie进行设置
    
- cookie中的数据有效期，不设置是会话级别的，浏览器关闭，会话结束，数据销毁，可以人为设置cookie的有效期
    
- cookie存储容量小，约4kb

cookie的查看

document.cookie

三、cookie封装

使用对象将cookie封装

//定义对象cookie

let cookie = {
    
    //设置对象里面的设置cookie事件
    //key	cookie的名称
    //value	cookie的值
    //time	cookie的有效时间(单位:min)
    
    setCookie(key, value, time){
        
        //判断cookie的名称或cookie的值是否存在
        
        if(!key || !value){
            
            //如果cookie的名称和cookie的值不存在返回空
            
            return null
        }
        
        //定义exp为空，方便后面赋值
        
        let exp = ""
        
        //如果cookie的有效时间存在
        
        if(time){
            
            //获取时间date
            
            let date = new Date()
            
            //获取当前时间戳now
            
            let now = date.getTime()
            
            //有效时间的结束时间
            
            date.setTime(now + time * 60 * 1000)
            
            //将结束时间转换为GTM标准时间
            
            let gmt = date.toGMTString()
            
            //exp赋值
            
            exp = ";expires=" + gmt
        }
        
        //当time存在时
        //return document.cookie = key + "=" + value + ";expires=" + gmt
        //当time不存在时
        //return document.cookie = key + "=" + value + ""
        
        return document.cookie = key + "=" + value + exp
    },
    
    //设置对象里面的获取cookie事件
    //key	cookie的名称
    
    getCookie(key){
        
        //将cookie以";"分割成有若干个值的数组arr
        
        let arr = document.cookie.split(";")
        
        //使用map()函数遍历
        
        let value = arr.map(item => {
            
            //因为arr里面的值item前后有空格，所以使用trim()函数
            //当前后没有空格的arr里面的值item.trim()是以cookie的名称key开头时
            
            if(item.trim().indexOf(key) == 0){
                
                //将arr里的值item以"="分割成cookie包含名称key和cookie的值value的数组
                //取该数组的第1项就是key对应的cookie的值
                
                return (item.split("="))[1]
            }
        })
        
        //value本为一个只有一个key对应的cookie的值和多个undefined的数组
        //value.join("")就是将value转为字符串且直接连接，这种连接方式会将undefined直接忽略掉
        //打印的就是需要的key对应的cookie的值
        
        console.log(value.join(""))
    }
}

//实例化
//设置cookie

cookie.setCookie("name", "zhangsan")
cookie.setCookie("age", 18, 60)
cookie.setCookie("sex", "nan")

//获取cookie名称对应的值

cookie.getCookie("name")

//zhangsan