浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式，可以利用cookie,session等等跟服务端进行数据交互。这么多种缓存机制有什么区别，怎么选择呢？本文将对此进行总结讨论一下，欢迎大家在评论区交流学习
html4的本地缓存
①cookie
1.保存位置：客户端。
2.使用方法：在每次请求的时候带上cookie,如果没有设置过期时间，那么cookie保存在内存中，在浏览器被关掉的时候被清除，这种cookie也被称为会话cookie（一个浏览器窗口称之为一个会话）。如果设置了过期时间，那么cookie就被保存在硬盘中，知道设置的过期时间到了为止。
3.存储大小和内容：保存的大小不能超过4kb；只能保存字符串类型，以文本的形式存储。
4.安全性：安全性低于session，常见的攻击有cookie欺骗，cookie截获，如cookie存放了用户的登录验证信息，那么我们只要拿到用户的cookie就可以伪造登录了，如跨站脚本攻击（xxs攻击），借助非法输入，在用户的网页中，插入非法代码（常见的script标签），执行获得用户的cookie。
5.应用场景：
(1) 判断用户是否登录过该网站了，实现类似记住密码的功能。
(2) 保存上次的登录信息。
(3) 保存上次查看的页面
①session
1.保存位置：服务端。
2.使用方法：当服务器收到请求要创建session对象时，会检查请求中是否有sessionid，有的话就返回该id对应的session对象，否则就创建该session对象，并返回给客户端（sessionid通常以cookie的方式存储）。如果客户端禁用了cookie那么就会使用URL重定向，将sessionid拼接在地址后面。
3.存储大小和内容：大小不受限制；采用hashtable的数据结构来存储，支持任意类型的对象。
4.安全性：安全性高于cookie，由于前面提到sessionid按cookie的方式存储，所以要破解session就要先破解cookie，同时session要登录了才有（或者启动session_start）,再有session具有实效性，第二次启动session_start前面的就失效了，最后sessionid是有加密处理的。
5.应用场景：
(1) 保存购物车的数据。
(2) 保存用户登录信息。
(3) 保存信息在session中，供多个页面使用，实现页面的通信。
html5的本地缓存
要知道这是为了解决html4中缓存的问题提出来的，由于cookie的大小受限，安全性低，每次请求携带cookie还影响带宽，操作还复杂，所以HTML5提出了webstorage来解决前面的问题
①webStorage
1. localstorage：
1.保存位置：永久保存在客户端，不与服务器进行交互通信。
2.使用方法：setItem(key,value):以键值对的形式存储信息；getItem(key):获取存储的数据，以键值传入获取相应的数据；removeItem(key):删除某个数据;clear():清楚所有的数据；key(index);获取某个索引的key
3.存储大小和内容：保存的大小一般为5MB；只能保存字符串类型，以文本的形式存储，但是可以借助JSON中的stringfy()和parse()方法来转化要存储的复杂数据。
4.安全性：不会随着HTTP header发送到服务端，所以安全性相对于cookie来说高，不会担心被截取，但是还是可以被伪造
5.应用场景：用户的长期登录，判断用户是否已经登录，长期保存至本地的数据。
2. sessionstorage：
1.保存位置：临时保存在客户端，不与服务器进行交互通信。
2.使用方法：setItem(key,value):以键值对的形式存储信息；getItem(key):获取存储的数据，以键值传入获取相应的数据；removeItem(key):删除某个数据;clear():清楚所有的数据；key(index);获取某个索引的key
3.存储大小和内容：保存的大小一般为5MB；只能保存字符串类型，以文本的形式存储，但是可以借助JSON中的stringfy()和parse()方法来转化要存储的复杂数据。
4.安全性：不会随着HTTP header发送到服务端，所以安全性相对于cookie来说高，不会担心被截取，但是还是可以被伪造
5.应用场景：敏感账号的一次性登录。
总结比较一下
webStorage是HTML5提出的解决原来HTML4中缓存操作复杂（要自己封装操作方法），大小受限（4kb）,影响带宽（每次请求都要携带），安全性低（在传输的过程中可能被截取，伪造）。其中分为两种 sessionStorage和localStorage,前者声明周期为一次会话，即浏览器关闭就失效，后者为永久保存，除非用户调用相应的api进行删除操作，相比较原来的缓存方式，webstorage具有操作简单（有原生的操作接口），更大的缓存空间（5MB还可以扩容），不影响带宽（每次请求可以不带着它），安全性较高（请求不带着它，就不担心它被截取，但是还是可以被伪造的）。
