localStorage,sessionStorage和cook

1、概念区别：

localStorage是客户端存储数据的两个对象，不会自动把数据发给服务器，仅在本地保存，用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除

sessStorage是客户端存储数据的两个对象，不会自动把数据发给服务器，仅在本地保存，用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据

cookie是一般由服务器生成，也可以客户端生成，cookie在浏览器和服务器间来回传递

2、存储时间区别

localStorage除非被清除，否则可以永久存储

sessStorage仅在当前会话有效，关闭页面或者浏览器后会被清除

cookie服务器端可以设置失效时间，客户端默认关闭浏览器后失效

3、存储数据大小区别

localStorage的存储空间是5M

sessStorage的存储空间是5M

cookie只有4k左右，存储过多数据会带来性能问题

4、作用域区别

sessionStorage不在不同的浏览器窗口共享，即使是同一个页面

localStorage在所有同源窗口中都是共享的

cookie也是在所有同源窗口中都是共享的 

5、使用的区别

 localStorage和sessionStorage的使用

不管是 localStorage，还是 sessionStorage，可使用的API都相同，常用的有如下几个（以localStorage为例）：

保存数据：localStorage.setItem(key,value);

读取数据：localStorage.getItem(key);

删除单个数据：localStorage.removeItem(key);

删除所有数据：localStorage.clear();

得到某个索引的key：localStorage.key(index);

提示: 键/值对通常以字符串存储，你可以按自己的需要转换该格式。

cookie的使用：

添加cookie示例

获取客户端的Cookie时，只能获取name与value属性，其它属性都不会被提交。

Cookie c = new Cookie("username","peter");// 新建一个Cookie对象

c.setMaxAge(24*60*60);                    // 设置过期时间1天，以秒为单位

response.addCookie(c);                    // 保存cookie到客户端

删除cookie示例

删除某个Cookie时，只需要新建一个只有maxAge和value不一样的同名Cookie，然后添加到response中覆盖原来的Cookie

Cookie cookie = new Cookie("username","peter");// 新建Cookie

cookie.setMaxAge(0);                          // 设置生命周期为0，表示将要删除

response.addCookie(cookie);                    // 执行添加后就从response里删除了

修改cookie示例

修改某个Cookie时，只需要新建一个只有value属性不一样的同名Cookie，然后添加到response中覆盖原来的Cookie

Cookie cookie = new Cookie("username","joker");// 新建Cookie

cookie.setMaxAge(24*60*60);                    // 设置生命周期

response.addCookie(cookie);                    // 执行添加后就从response里覆盖修改了

注意：修改、删除Cookie时，新建的Cookie除value、maxAge之外的所有属性，例如name、path、domain等，都要与原Cookie完全一样。否则，浏览器将视为两个不同的Cookie而不会覆盖之前的Cookie，从而导致修改、删除失败。