摘要：是比较老的前端缓存技术了，它的特点是想要使用它前端必须要有服务静态网页是不行的，而且存储大小限制在。
1.Cookie
cookie是比较老的前端缓存技术了，它的特点是想要使用它前端必须要有服务（静态网页是不行的），而且存储大小限制在4kb。那么为什么必须要有服务才能使用cookie呢？因为只要有请求涉及cookie，cookie就要在服务器和浏览器之间来回传送，而且由于浏览器的跨域限制，客户端和服务端必须要保证同源的原则（也就是跨域问题，详情见我的其他文章），由于cookie是存放在前端的，所以安全问题一直是个大问题，因此一般重要的信息不建议放在cookie中存放。
2.Session
对于服务端的程序眼来说session大家肯定很熟悉了，session是一种服务端的机制，也就是能把信息存放在服务端，所以安全可以保障，它的原理是通过session id来识别客户端，这个session id是存放在cookie中的（当然session id让用户看见没无妨），服务端会通过session id来识别客户端进行匹配和判断。它和cookie对比起来差距就很明显了，一个是把数据存在客户端；一个存在服务端，从安全性考虑的话一般像用户名密码这种私密信息一般放在session中。
3.localStorage
它的特点就是“持久”，一旦通过保存，不通过手动清除的话，就会一直保存在前端，它的保存格式是键值对的方式也就是“key-value”的方式保存的，它的存储空间大小限制在500万字符左右，一下是它的一些使用方法：
localStorage.length 获得storage中的个数 localStorage.key(n) 获得storage中第n个元素对的键值（第一个元素是0） localStorage.getItem(key) 获取键值key对应的值 localStorage.key 获取键值key对应的值 localStorage.setItem(key, value) 添加数据，键值为key，值为value localStorage.removeItem(key) 移除键值为key的数据 localStorage.clear() 清除所有数据
4.sessionStorage
这个和localStorage有什么区别呢？sessionStorage是一种会话级别的本地存储，一旦关闭浏览器他就会消失，而前者是很“持久”的，即使你关闭一万次浏览器也没事，所以差距还是很大的。后两者是H5才有的特性，因为现在都是前后端分离的开发模式，前端工程师都很青睐这两种前端缓存方式，以下是sessionStorage的记本用法：
sessionStorage.length 获得storage中的个数 sessionStorage.key(n) 获得storage中第n个元素对的键值（第一个元素是0） sessionStorage.getItem(key) 获取键值key对应的值 sessionStorage.key 获取键值key对应的值 sessionStorage.setItem(key, value) 添加数据，键值为key，值为value sessionStorage.removeItem(key) 移除键值为key的数据 sessionStorage.clear() 清除所有数据
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/93905.html
摘要：是比较老的前端缓存技术了，它的特点是想要使用它前端必须要有服务静态网页是不行的，而且存储大小限制在。 1.Cookie cookie是比较老的前端缓存技术了，它的特点是想要使用它前端必须要有服务（静态网页是不行的），而且存储大小限制在4kb。那么为什么必须要有服务才能使用cookie呢？因为只要有请求涉及cookie，cookie就要在服务器和浏览器之间来回传送，而且由于浏览器的跨域限...
摘要：是比较老的前端缓存技术了，它的特点是想要使用它前端必须要有服务静态网页是不行的，而且存储大小限制在。 1.Cookie cookie是比较老的前端缓存技术了，它的特点是想要使用它前端必须要有服务（静态网页是不行的），而且存储大小限制在4kb。那么为什么必须要有服务才能使用cookie呢？因为只要有请求涉及cookie，cookie就要在服务器和浏览器之间来回传送，而且由于浏览器的跨域限...
摘要：虽然今年没有换工作的打算但为了跟上时代的脚步还是忍不住整理了一份最新前端知识点知识点汇总新特性，语义化浏览器的标准模式和怪异模式和的区别使用的好处标签废弃的标签，和一些定位写法放置位置和原因什么是渐进式渲染模板语言原理盒模型，新特性，伪 虽然今年没有换工作的打算 但为了跟上时代的脚步 还是忍不住整理了一份最新前端知识点 知识点汇总1.HTMLHTML5新特性，语义化浏览器的标准模式和怪...
摘要：虽然今年没有换工作的打算但为了跟上时代的脚步还是忍不住整理了一份最新前端知识点知识点汇总新特性，语义化浏览器的标准模式和怪异模式和的区别使用的好处标签废弃的标签，和一些定位写法放置位置和原因什么是渐进式渲染模板语言原理盒模型，新特性，伪 虽然今年没有换工作的打算 但为了跟上时代的脚步 还是忍不住整理了一份最新前端知识点 知识点汇总1.HTMLHTML5新特性，语义化浏览器的标准模式和怪...
阅读 3713·2021-09-29 09:34
阅读 3727·2021-09-27 13:34
阅读 531·2021-09-24 09:47
阅读 3010·2019-08-30 15:53
阅读 1772·2019-08-26 13:54
阅读 2037·2019-08-26 13:43
阅读 505·2019-08-23 14:47
阅读 1709·2019-08-23 14:28
