欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

前端缓存那些事

程序员文章站 2022-03-02 21:03:37
...

先聊聊cookie

什么是cookie?

了解http的同学,肯定知道,http是一个不保存状态的协议,什么叫不保存状态,就是一个服务器是不清楚是不是同一个浏览器在访问他,Cookie实际上是一小段的文本信息。客户端请求服务器,如果服务器需要记录该用户状态,就使用response向客户端浏览器颁发一个Cookie。客户端浏览器会把Cookie保存起来。当浏览器再请求该网站时,浏览器把请求的网址连同该Cookie一同提交给服务器。服务器检查该Cookie,以此来辨认用户状态。服务器还可以根据需要修改Cookie的内容。

cookie原理图解

看下服务器端的具体实现:

//响应中带有cookie 
res.cookie('userid', _id);
复制代码

response Headers中会set-cookie userid

此后的请求头中都会带着userid

cookie不可跨域

cookie属性全解

  1. name

  2. vlaue

    由于cookie规定是名称/值是不允许包含分号
    ,逗号,空格的,所以为了不给用户到来麻烦,考虑服务器的兼容性,任何存储cookie的数据都应该被编码。

  3. domin

    这个是指的域名,这个代表的是,cookie绑定的域名,如果没有设置,就会自动绑定到执行语句的当前域,还有值得注意的点,统一个域名下的二级域名也是不可以交换使用cookie的,比如,你设置www.baidu.com和image.baidu.com,依旧是不能公用的。

  4. path

    path这个属性默认是'/',这个值匹配的是web的路由,举个例子:

    //默认路径
    www.baidu.com
    //blog路径
    www.baidu.com/blog
    复制代码

    我为什么说的是匹配呢,就是当你路径设置成/blog的时候,其实它会给/blog、/blogabc等等的绑定cookie

  5. Expires/Max-Age

    如果你想要cookie存在一段时间,那么你可以通过设置Expires属性为未来的一个时间节点,Expires这个是代表当前时间的,这个属性已经逐渐被我们下面这个主人公所取代——Max-Age Max-Age,是以秒为单位的,Max-Age为正数时,cookie会在Max-Age秒之后,被删除,当Max-Age为负数时,表示的是临时储存,不会生出cookie文件,只会存在浏览器内存中,且只会在打开的浏览器窗口或者子窗口有效,一旦浏览器关闭,cookie就会消失,当Max-Age为0时,又会发生什么呢,删除cookie,因为cookie机制本身没有设置删除cookie,失效的cookie会被浏览器自动从内存中删除,所以,它实现的就是让cookie失效。

  6. HTTP

    这个属性是面试的时候常考的,如果这个属性设置为true,就不能通过js脚本来获取cookie的值。

  7. size

    1、一个浏览器针对一个网站最多存20个Cookie,浏览器一般只允许存放300个Cookie

    2、每个Cookie的长度不能超过4KB(稀缺)。但不同的浏览器实现的不同

  8. secure

    这个属性译为安全,http不仅是无状态的,还是不安全的协议,容易被劫持,打个比方,你在手机端浏览网页的时候,有没有中国移动图标跳出来过,闲言少叙,当这个属性设置为true时,此cookie只会在https和ssl等安全协议下传输。

  9. same-site

参考:

http://www.cnblogs.com/xianyulaodi/p/6476991.html