前端本地缓存

sessionStorage.setItem("key","value"); // 存

sessionStorage.getItem("key"); // 取

 

 

 

sessionStorage.removeItem("key"); // 删除

 

 

localStorage.setItem("key","value"); // 存

localStorage.getItem("key"); // 取

localStorage.removeItem("key"); // 删除

 

 

import Cookies from 'js-cookie';

 

Cookies.set("key","value"); // 存

 

Cookies.get("key"); // 取

 

Cookies.remove('key'); // 删除

 

cookie、localstroage与sessionstroage的一些优缺点

1.    Cookie

在前端开发中，尽量少用cooie，原因：

（1）   cookie限制大小，约4k左右，不适合存储业务数据，尤其是数据量较大的值；

（2）   cookie会每次随http请求一起发送，浪费宽带。

2.     在移动开发中尽量用localstroage，优点：

（1）   存储数据量大；

（2）   不会随http请求一起发送；

缺点：

（1）   在浏览器的隐私模式下不能读取；

（2）   本质是在读写文件，写入数据量大的话会卡（FF是将localstorage写入内存中的）

（3）   不能被爬虫读取

3.  localStorage与sessionStroage区别

     （1）localStroage是将信息存储在硬件设备中的，关闭浏览器或网页也不会消失；

    （2）sessionStroage的有效期只是网页在浏览器打开到关闭的时间段

隐私模式下可以采用window.name模拟sessionStorage的方式处理，因为window.name是可做保存的，这个也是其解决跨域方案的原因。

在android Hybrid中有一后退按钮，此按钮一旦按下会回到上一个页面，这个时候里面的localstorage可能会读取失效！一个简单不靠谱的解决方案是在webapp中加入：

window.onunload= function () { };//适合单页应用，不要问我为什么，我也不知道