在浏览器中，我们常见到的存储对象，分别有localStorage，sessionStorage，cookie。这三者同样能在浏览器中存储数据，但是也存在着各自的特点，在不同的场景中运用。
首先是localStorage和sessionStorage，这两者比较相近
通用的API
localStorage和sessionStorage有很多通用的API
以localStorage为例
- setItem()
该方法传入两个参数，第一个参数表示传进去的值要存储在哪个属性名上，第二个参数表示要传进去的值
如果传入了第一个参数为对象里面原有的属性，那就会覆盖原来的值
当使用该方法传入一个对象时，因为localStorage目前只支持传入字符串，所以传入的内容会变为"[object Object]"
除了这种方法之外，也可以使用点运算符来设置，当然也可以通过ES6中的方括号的写法来设置
window.localStorage.text='content'
let t='text'
window.localStorage[t]='content'
-
getItem()
该方法传入一个参数，表示要获取的值对应的属性名
-
removeItem()
该方法传入一个参数，表示要删除的值对应的属性名
-
clear()
clear方法用于清空localStorage对象里面的属性
localStorage
localStorage是只读的，可以修改其属性
localStorage用于保存当前网站在本地浏览器的信息，保存的数据没有期限，除非手动删除。在localStorage中保存的数据，即使关闭窗口重新打开也不会被消失。（sessionStorage在关闭窗口后保存的数据会消失）
要注意的是，同一个域名共享一个localStorage对象，当然，同一域名但是不同浏览器是不共享一个localStorage对象的
通过window.localStorage来获取localStorage对象
局限
- localStorage无法被爬虫抓取到
- localStorage本质上是对字符串的读取，如果存储内容过多的话会消耗内存空间，导致页面变卡
- 存储的值限定为字符串类型，若要存储json格式要进行转换
- 有一些浏览器不支持，比如IE8以上才支持localStorage
为localStorage设置过期时间
相对于sessionStorage来说，localStorage没有过期时间，但是如果我们想使用localStorage来设置过期时间，可以通过修改其set方法和get方法来实现
localStorage空间满了的处理方法
如果localStorage存满了或者存进去的数据大于localStorage对象存储数据的最大容量的话，那么就会出现报错
https://www.cnblogs.com/kidney/p/9058352.html
sessionStorage
sessionStorage和localStorage类似，可以临时保存在同一窗口（或标签页）的数据，但是与localStorage不同的是，sessionStorage的有效时间是一个会话，在关闭窗口或者标签页的时候数据会被清除
但是sessionStorage在当前标签页不关闭调转的情况下，还是能保存着的
sessionStorage和localStorage一样，存储的空间一般为5MB
上面两个对象存储数据的问题
在控制台中就能修改这些数据，所以不应该将敏感数据放在这两个对象中
XSS（Cross Site Scripting）
XSS攻击全称跨站脚本攻击，是为了区别于层叠样式表CSS所以使用XSS作为缩写
使用cookie，localStorage，sessionStorage时要注意是否有代码存在XSS注入的风险
攻击类型
- 非持久型
是指发生请求时，XSS代码出现在请求URL中，作为参数提交到服务器，服务器解析并响应。响应结果中包含XSS代码，最后浏览器解析并执行。
举个例子
`${url}?name=<script>alert(111)</script>`
- 持久型
存储型XSS，也叫持久型XSS，主要是将XSS代码发送到服务器（不管是数据库、内存还是文件系统等。），然后在下次请求页面的时候就不用带上XSS代码了。最典型的就是留言板XSS。用户提交了一条包含XSS代码的留言到数据库。当目标用户查询留言时，那些留言的内容会从服务器解析之后加载出来。览器发现有XSS代码，就当做正常的HTML和JS解析执行。XSS攻击就发生了。
比如在某个页面上有留言版，我们在留言上写上这样的内容
<script>alert(1111)</script>
在下次用户打开页面的时候，就会先弹出1111（如果没有对该攻击做出防御的话）
cookie
简介
由于HTTP本身是无状态的，服务器无法记住发送请求的客户端。cookie实际上是一小段文本信息（只有4k大小），如果服务器要记住发起请求的用户的状态，就可以使用cookie来实现。
当客户端向服务器端发送请求的时候，服务器端向客户端发回一个cookie，而客户端将该cookie保存下来，每次发送请求的时候带上这个cookie，因为服务器端也存有该cookie，所以可以通过检查来cookie来确认用户的状态。
过程
当用户发起登录请求时，cookie的设置会经历下面的过程
- 客户端发送一个请求到服务器
- 服务器发送一个http响应到客户端，其中包括set-cookie的头部
- 客户端保存响应中的cookie，再向服务器发送请求，请求中包含cookie的头部
- 服务器返回响应数据
属性
name=value
键值对，可以设置要保持的key/value，要注意的是这里的name不能和其他属性重名
Expires
该属性用来设置cookie的有效期。cookie中的maxAge用来表示该属性，单位为秒。
Cookie中通过getMaxAge()和setMaxAge(int maxAge)来读写该属性。maxAge有3种值，分别为正数，负数和0。
如果maxAge为正数，则cookie会在对应的时间结束后自动失效。浏览器会将maxAge为正数的cookie写入对应的cookie文件中（每个浏览器的存放位置不同）。只要在该时间内，不管用户重新打开浏览器甚至是电脑，都还是可以保持登录状态的。
如果maxAge为0，则表示立即删除cookie，一旦执行该方法，cookie会马上失效。
如果maxAge为负数，则cookie会在浏览器关闭的时候失效，于为0的情况不同的是，为负数的情况下，cookie还会保持一段时间。
domain
该属性用来设置生成cookie的域名
cookie无法跨域名使用，只能在当前域名下使用
正常情况下，同一个一级域名下的两个二级域名也不能交互使用cookie,比如test1.mcrwayfun.com和test2.mcrwayfun.com，因为二者的域名不完全相同。如果想要mcrwayfun.com名下的二级域名都可以使用该Cookie，需要设置Cookie的domain参数为.mcrwayfun.com，这样使用test1.mcrwayfun.com和test2.mcrwayfun.com就能访问同一个cookie
path
path属性决定允许访问Cookie的路径。比如，设置为"/"表示允许所有路径都可以使用Cookie
secure
http除了是无状态的外，还是不安全的。信息不经任何处理就会在网络上传输。可以通过将cookie的secure属性设置为true来让浏览器只在https和SSL中传输此类cookie
修改删除cookie
HttpServletResponse提供的Cookie操作只有一个addCookie(Cookie cookie)，所以想要修改Cookie只能使用一个同名的Cookie来覆盖原先的Cookie。如果要删除某个Cookie，则只需要新建一个同名的Cookie，并将maxAge设置为0，并覆盖原来的Cookie即可。
新建的Cookie，除了value、maxAge之外的属性，比如name、path、domain都必须与原来的一致才能达到修改或者删除的效果。否则，浏览器将视为两个不同的Cookie不予覆盖。
三者的对比
- 大小
对于localStorage和sessionStorage来说，存储的大小是相近的，大概为5MB，而cookie相对较小，只有4KB左右 - 清除方式
对于localStorage来说，要清除它只能通过其本身的API；
而对于sessionStorage来说，除了和localStorage同样的清除方法，将标签页关闭也能清除它；
对于cookie来说，在上文也提到了，HttpServletResponse提供的Cookie操作只有一个addCookie，如果要彻底清除cookie，要么等待cookie的有效时间到达，要么新建一个同名的cookie并将maxAge设置为0
