浏览器 Cookie 老生常谈
cookie是一个前端必备的知识了,我在刚入行的时候,也是草草研究整理了一篇,当时并不知其所以然。
传送门:
简单聊聊Cookie 和 Session
https://www.jianshu.com/p/4f3b683afa4c
最近重新整理了一下知识点,烂笔头一下~。。
Cookie的起因
为什么会有cookie呢,根本原因就是浏览器是无状态的。你可以想象他就是一个傻子,他记不住客户端长什么样子。
可是对于前端非常重要的一个需求就是,识别不同的用户,是否登录登出,是管理员还是用户。
既然浏览器无状态,他就不能帮我们识别这些需求。
那么该如何识别用户呢,假想我们去迪士尼(某网站),这个门票(登录状态)是可以玩(持续)两天的,第二天你再去售票处(某网站入口),售票员(网站)怎么记住你呢?
server在你第一次登录的时候,也就是第一次入园的时候,就给你个特殊的票据,标记你来过,这个标记,就是cookie
response.setHeader('Set-Cookie', 'myDisneyTicket=xxx; login=yyy')
从此以后,在用户关闭client前,每次对该host访问,request都会自动带上cookie
而在server端获取cookie来判断用户身份。
const cookie = request.headers.cookie // 获取cookie,是一个字符串,需要捕获成key: value
如何手动使cookie失效?response设置同样的cookie,但是比当前时间早就可以了
let time = new Date(0) // 1970年,肯定比现在早了
response.setHeader('Set-Cookie', 'myDisneyTicket=xxx, expires='time.toUTCString()') //需要转换成格林威治时间
Cookie被伪造
用户在客户端是可以用JS伪造cookie的,这就是cookie不足的地方。
document.cookie = 'myDisneyTicket=xxx; login=yyy'
用户用JS伪造了一份ticket,愉快的免费游玩了Disney !
cookie可以被随意伪造,那是不是完全没用了。NO ! 想想一下你cookie的内容如果是随机码,那还有用户知道他的含义吗? 这个时候session 就诞生了。
cookie升级版:session
首先说下session:
它一个存储在server端的数据结构,它可以是对象,可以是数组,可以是任何数据结构。
它可以存在server端的"任何地方", 可以是内存,可以是数据库,大多数情况下是文件。
通常情况下,session的每一个key对应着一个用户信息
正如上所说,如果cookie的内容是一个随机码,而这个随机码和session数据结构中的key一一对应,那么server端一样是可以从cookie这个随机码里识别不同的用户,而且可以获取到额外的用户信息。
重要的是这个session信息,server端可以选择存储的时长,更加方便。 但毕竟有存储就有占用,对服务器的负载和性能都会有一定影响的。
session: 基于cookie的升级
为什么这么说呢,按上面的推论来说,session来源于cookie的启发,但是sessionID的传递方式并不仅仅只有cookie,所以我这里说他是基于cookie思路的升级
我们可以把sessionID 存在localStorage 甚至url,任何可以告知给server端的地方都可以。
一句话总结
先有了cookie, server端在response里设置了cookie, 浏览器在以后的请求就无条件传回去。但是不安全,所以改传一个ID (可以不叫sessionID, 只是session比较形象)。 server端根据ID来获取用户数据,进而返回需要的数据,这样就安全了。