Cookie和缓存storage

Cookie，有时也用其复数形式 Cookies。类型为“小型文本文件”，是某些网站为了辨别用户身份，进行Session跟踪而储存在用户本地终端上的数据（通常经过加密），由用户客户端计算机暂时或永久保存的信息。
Cookie是一段不超过4KB的小型文本数据，由一个名称（Name）、一个值（Value）和其它几个用于控制Cookie有效期、安全性、使用范围的可选属性组成。其中 [3] ：
(1)Name/Value：设置Cookie的名称及相对应的值，对于认证Cookie，Value值包括Web服务器所提供的访问令牌 [3] 。
(2)Expires属性：设置Cookie的生存期。有两种存储类型的Cookie：会话性与持久性。Expires属性缺省时，为会话性Cookie，仅保存在客户端内存中，并在用户关闭浏览器时失效；持久性Cookie会保存在用户的硬盘中，直至生存期到或用户直接在网页中单击“注销”等按钮结束会话时才会失效 。

如何设置查看cookie

document.cookie = 'nickname = zed' //打开浏览器查看cookie

设置cookie存储时间
下图设置cookie存储时间为1分钟

let  now = new Date()
now.setMinutes(now.getMinutes()+1)
document.cookie = 'nickname=zed;expires='+now.toUTCString()

清楚cookie，
如下图，下图意思是5s过后cookie消失

setTimeout(() => {
let now = new Date()
now.setMinutes(now.getMinutes() - 1)
document.cookie = 'nickname=zed;expires=' + now.toUTCString()
        }, 5000);

只需要将时间改为负数即可
localStorage为本地存储，是永久的
例如 ：

 localStorage.setItem('username','zed')
console.log(localStorage.getItem('username','zed'));

然后打开 控制台可查看到缓存

sessionStorage为会话存储，是临时的
例如

sessionStorage.setItem('username','zed')
console.log(sessionStorage.getItem('username','zed'));

然后打开 控制台可查看到缓存

但是这个是临时的，当我们 把浏览器窗口关闭后，就没有了，但是localStroage还是存在的
我们把代码注释掉



由此可见localStorage是永久保存的，而sessionStorage为临时储存