Web存储
随着互联网的快速发展,基于网页的应用越来越普遍,同时也变的越来越复杂,为了满足各种各样的需求,会经常性在本地存储大量的数据,传统方式我们以document.cookie来进行存储的,但是由于其存储大小只有4k左右,并且解析也相当的复杂,每一次发送请求都会携带上cookie,会造成带宽的浪费,给开发带来诸多不便,HTML5规范则提出解决方案。
1、设置、读取方便
2、容量较大,sessionStorage约5M、localStorage约20M
3、只能存储字符串,可以将对象JSON.stringify() 编码后存储
window.sessionStorage
1、生命周期为关闭浏览器窗口
2、在同一个窗口下数据可以共享
window.localStorage
永久生效,除非手动删除 储存在本地
2、可以多窗口共享
window.localStorage.setItem(“username”,“feifei”);
window.sessionStorage.setItem(“username2”,“feifei2”);
清楚储存内容
window.localStorage.clear();
相同点:都是存储数据,存储在web端,并且都是同源
不同点:
cookie 只有4K 小 并且每一次请求都会带上cookie 体验不好,浪费带宽
session和local直接存储在本地,请求不会携带,并且容量比cookie要大的多
session 是临时会话,当窗口被关闭的时候就清除掉 ,而 local永久存在,cookie有过期时间
cookie 和local都可以支持多窗口共享,而session不支持多窗口共享 但是都支持a链接跳转的新窗口
H5api
最新推荐文章于 2022-08-30 15:19:29 发布