Cookies和Session

image

cookies是什么?

cookie 就是浏览器储存在用户电脑上的一小段文本文件。cookie 是纯文本格式,不包含任何可执行的代码。

Cookie的作用是什么?

  1. HTTP协议是无状态的,对于一个浏览器发出的多次请求,WEB服务器无法区分 是不是来源于同一个浏览器。Cookie可以随HTTP请求一起被传递的额外数据, 用来识别身份.
  2. 记录用户使用历史
    设想你某次登陆过一个网站,下次登录的时候不想再次输入账号了,怎么办?我们可以把这个信息可以写到Cookie里面,访问网站的时候,网站页面的脚本可以读取这个信息,就自动帮你把用户名给填了,能够方便一下用户。这也是Cookie名称的由来,给用户的一点甜头。

如何使用Cookie

  1. 服务器通过Set-Cookie 响应头设置Cookie 给客户端一串字符串
    response.setHeader('Set-Cookie', 'sign_in_email=...;HTTPOnly')
  2. 浏览器得到Cookie之后,每次请求(访问)相同页面时都要带上Cookie
  3. 服务器读取Cookie就知道登录用户的信息(email)
  4. 客户端要在一段时间内保存这个Cookie

用户登录成功 得到一个cookie sign_in_emial
用户访问首页时 请求里面包含了Cookie
服务器读取 Cookie


面试的常见问题

  1. 用Chrome登录再用safari登录, safari会带上cookie吗?
    当然不会
  2. 在windows系统中存在c盘的一个文件, 其他存在硬盘的一个文件.
  3. cookie可以作假吗? 可以(不安全)
  4. cookie 有有效期吗?
    默认在用户关闭页面后关闭, 后台代码可以设置有效期

Session

Session是什么?

前面提到了Cookie有个缺点是可以人为修改,有一定的安全隐患. 于是诞生了Session.


如何使用Session?
一般来说Session是基于Cookie实现的,它利用一个sessionId把用户的敏感数据隐藏起来

  1. 将 SessionID(随机数) 通过 Cookie 发给客户端
  2. 客户端访问服务器时, 服务器读取 SessionID
  3. 服务器有一块内存(哈希表)保存了所有 Session
  4. 通过 Session 我们可以得到对应用户的隐私信息, 如 id, email
  5. 这块内存就是服务器上的所有 session
//预先在服务器端预留对象准备存储各种session
let sessions = {}
...
let sessionId = Math.random() * 100000
sessions[sessionId] = {sign_in_email: email}
response.setHeader('Set-Cookie', `sessionId=${sessionId};HTTPOnly`)

Tips: 使用随机数来做sessionId,其他人只能看到这串随机数,而真正的信息却保存在了服务器端的sessions对象里面。它就像一个密码簿一样,有效的信息与sessionId一一对应,这是服务器的事,保证了安全性。

 

LocalStorage

在HTML里面js文件里面的变量或对象,每当网页刷新的时候,就会死掉,又重新生成,虽然还是那个a,但是刷新后已经是另一块内存了。既然它也没变,我们为什么不把一些不重要的信息一直保留着呢,即使刷新了a还是那个a,也就是持久化存储的意义。以前使用Cookie做这个功能,不过Cookie每次发请求会把Cookie里面的所有东西都带着去服务器,加重内存的负担,请求响应时间长,所以html5给了一个新的API localStorage

LocalStorage本质上还是个hash,不过是存在于浏览器端的,不同于session存在与服务器端的hash。一般存储的都是没有用的或者不敏感的信息。

localStorage是window的全局属性,常用的有三个方法

//1. 添加键、值
var arr = [1,2,3]
localStorage.setItem('a', arr)
//2. 获得键、值
localStorage.getItem('a')
//3.清空localStorage
localStorage.clear()

注意,存储JSON对象时,它存的值全是字符串,如果想存储字符串我们需要用到JSON.stringify( )

1.LocalStorage跟http的值无关
2.http不会带上Localstorage的值
3.只有相同域名的页面才能互相读取LocalStorage
4.每个域名LocalStorage最大存储量为5mb
5.用来记录有没有提示过用户, 以及一些没用的信息,不能存密码
6.永久有效,除非用户清理缓存

SessionStorage(会话存储)

1234同上
5.用户关闭页面后失效(会话结束后)


有趣的问题

    1. cookie和Session是什么关系?
      Session是基于Cookie实现的, 因为Session必须将SessionID放到cookie里面然后发到客户端

    2. cookie和localstorage的区别
      cookie会被带到服务器中, 一般大小为4kb , 而localstorage不会, 一般大小为5mb.

    3. LocalStorage和SessionStorage关系
      SessionStorage用户关闭页面后失效而LocalStorage不会.

posted @ 2020-02-23 20:40  清语堂  阅读(174)  评论(0编辑  收藏  举报