JS总结cookie与webStorage（二 ）

一 Web Storage 与 Cookie 的区别：

1 Web Storage 中的数据仅在存在本地，不与服务器发生交互。Cookie 中的数据会在浏览器和服务器中来回传递。

2 Web Storage 存储空间更大，可以达到 5M。Cookie 数据大小不超过 4KB 。

3 Web Storage 提供 setItem ， getItem ， removeItem ， clear 等方法Cookie 需要自己封装 方法

4 cookie 需要指定作用域，不可以跨域调用，但 Web Storage 可以跨域调用

5 cookie 中的数据在过期时间之前均有效， Web Storage 则不同， sessionStorage 中的数据在当前浏览器窗口关闭后自动删除， localStorage  持久存储数据，除非主动删除数据。

 注： 但 Cookie 是不可以或缺的： Cookie 的作用是与服务器进行交互，作为 HTTP 规范的一部分而存在 ，而 Web Storage 仅仅是为了在本地 “ 存储 ” 数据而生。

 

二 webStorage与cookie跨域：

cookie跨域：https://blog.csdn.net/chou_out_man/article/details/80664413

1. 顶级域名之间设置一级域名；
2. nginx反向代理方式；
3. jsonp方式；

webStorage跨域：利用window.postMessage解决跨域：https://www.haorooms.com/post/window_postMessage

 

三 cookie属性基本操作：https://segmentfault.com/a/1190000004556040

1. domain 和 path：domain是域名，path是路径，两者加起来就构成了 URL，domain和path一起来限制 cookie 能被哪些 URL 访问。
2. secure：secure选项用来设置cookie只在确保安全的请求中才会发送。当请求是HTTPS或者其他安全协议时，包含 secure 选项的 cookie 才能被发送至服务器。
3. httpOnly：这个选项用来设置cookie是否能通过 js 去访问；默认情况下，cookie不会带httpOnly选项(即为空)，所以默认情况下，客户端是可以通过js代码去访问（包括读取、修改、删除等）这个cookie的。