2019-09-29 cookie、sessionStorage

cookie

In fact, cookies are small files which are located on a user’s computer.

存储类型	session
保留时间	浏览器进程结束，cookie如未特别设置，则被清除。
可见范围	同源子目录可见

tips：
cookie的默认的domain是当前的网页所在的 location.host ，默认的path 就是当前页面的 location.pathname

web Storage

localStorage 和 sessionStorage 都是Storage类对象（持久化关联数组，索引是字符串，值也是字符串），localStorage 和 sessionStorage 的区别在于存储的保留时间和可见范围不同。

特性	localStorage	sesionStorage
保留时间	一直保存，直到JavaScript或浏览器主动删除	在会话期间保留（会话期间指浏览器中这个tab未被关闭）,页面刷新不受影响
可见范围	同源共享	同源单tab内可用(目录无关）

基于上面的知识，我们来解决一些问题：

• 1、我想一个网站（同源）共享登录信息，怎么办？
  如果是在根目录的页面负责设置cookie，则不用做任何设置即已经实现。
  如果是在某个子目录下的页面负责设置cookie，则需要在设置cookie时，设置 path 为 “/”

• 2、我想一个网站群（不同源，子域）共享登录信息，怎么办？
  在设置cookie的页面，设置 domain 为 域名的公共部分，比如
  a.test.com 和 b.test.com 是一个网站群的两个子域，则设置 domain 为 .test.com 即可。
  （注意，domain 可以具体到某个子域，但必须至少包含 二级域名+顶级域名）
  domain说明资料¹ domain说明资料²

• 3、我能不能拿到别的网站的cookie？
  如果不是问题2的情况，不可以。

• 4、同一个网站（同源），但别的页面设置的path，某个页面不在可以访问cookie的范围内，怎么办？
  找一个能够访问cookie的页面，把它包含在一个iframe中，放在这个想访问cookie的页面里，就可以实现间接访问cookie（获取的是iframe中页面的cookie）。

• 5、cookie追踪用户，怎么实现？
  参考：
  https://www.cnblogs.com/zhuanzhuanfe/p/8010854.html
  https://www.v2ex.com/amp/t/327997

• 6、单点登录？
  https://www.cnblogs.com/sueris/p/5674169.html

//资料
视频：讲了什么是cookie、谁能访问cookie、cookie的进化、利用cookie对用户画像

资料：

cookies-vs-local-storage

Local Storage vs Cookies

https://stackoverflow.com/questions/19867599/what-is-the-difference-between-localstorage-sessionstorage-session-and-cookies

实例 - “登陆信息”用cookie存还是localStorage存好？
cookie、sessionStorage、localStorage 详解及应用场景

https://www.youtube.com/watch?v=klLMeL7I4O0

以下截图来自：
https://www.youtube.com/watch?v=2PPSXonhIck
Session流程：

翻译：

1、用户提交登录相关凭证（比如邮箱+密码进行登录）
2、服务器对比数据库中信息验证凭证
3、服务器创建一个临时的用户 `session`
4、服务器发给用户一个cookie，包含了 `session` 的 `ID` (一个唯一标识符，用来标识是哪一个 session )
5、用户在以后的每次请求都会带上 cookie
6、服务器在接收到用户的请求后，根据 会话存储 和 访问权限 对其进行验证（确认是哪一个session，对应的权限有哪些）
7、当用户登出时，服务器销毁 session 。并清除 cookie。