美文网首页
Cookie Session localStorage

Cookie Session localStorage

作者: xiaoxinwan | 来源:发表于2018-10-02 12:30 被阅读0次

    Cookie

    1. 是什么?
      • Cookie是服务器保存在浏览器的一小段文本信息,每个Cookie的大小一般不超过4KB。
      • Cookie主要用来分辨两个请求是否来自同一浏览器,以及用来保存一下状态信息。
    2. 常用场合
    • 对话管理:保存登陆、购物车等需要记录的信息。
    • 个性化:保存用户的偏好
    • 追踪:记录和分析用户的行为
    1. 特点
      1. 服务器通过Set-Cookie响应头设置Cookie
      2. 浏览器得到Cookie之后,每次请求都会带上Cookie
      3. 服务器读取Cookie就知道登陆用户的信息
    2. Cookie包含的信息
      • Cookie的名字
      • Cookie的值(用于写真实数据)
      • 到期时间
      • 所属域名(默认是当前域名)
      • 生效的路径(默认是当前网址)
    3. 创建Cookie
      当服务器收到HTTP请求时,服务器可以在响应头里面添加一个Set-Cookie选项。浏览器收到响应后,保存这个Cookie。

    Set-Cookie: <Cookie名> = <Cookie值>


    Session

    一种持久网络协议,在用户端和服务端之间创建关联,从而起交换数据包的作用机制。

    session的实质是存储于服务器里的一小块内存。
    服务器通过Cookie给用户一个sessionID,然后sessionID对应服务器的一小块内存,
    每次用户访问服务器时,服务器通过sessionID读取session,得知用户的隐私信息。

    session是基于Cookie实现的。

    /* 服务器端 */
    /* 1. 当第一次使用session时,服务器创建一个sessionId
    *  此Id作为session中存放用户信息的唯一标识
    */
    let session = {}
    let sessionId = Math.random().toString.slice(2)
    session[sessionId] = userinfo
    /* 2. 服务器通过Cookie给用户返回一个sessionId*/
    response.setHeader('Set-Cookie', sessionId)
    
    /* 客户端发送请求 */
    /* 3.当用户访问同一个URL时,向服务器发送这个内容为sessionId的Cookie头*/
    Request Header
    HTTP/1.1 200 OK
    Content-Type: text/html
    Content-Length: 580
    Cookie: sessionId   //sessionId指的是内容
    ...
    
    /* 服务器端 */
    /* 4. 服务器收到Cookie中的sessionId,
    * 然后读取相应的session的对应内存,最后得到用户信息。
    */
    if (requeset.headers.cookie){
      let sessionId = request.headers.cookie
      let userInfo = session[sessionId]
    }
    

    localStorage

    HTML5新增的API,只能存字符串,遵循同源策略,属于本地存储。

    可以操作当前页面的哈希表

    localStorage.getItem('a');
    localStorage.setItem('a','1')
    localStorage.setItem('jsonString',JSON.stringify({name:'obj'}) //利用JSON存对象
    localStorage.clear()
    

    特点

    1. localStorage 跟HTTP无关
    2. HTTP 不会带上 localStorage 的值
    3. 只有相同域名的页面才能互相读取 localStorage (没有同源这么严格)
    4. 每个域名 localStorage 的最大存储量为 5Mb 左右(每个浏览器不一样)
    5. 常用场景:记录有没有提示过用户(不敏感的信息,反正不能记录密码)
    6. localStorage永久有效,除非用户清理缓存

    SessionStorage

    1. SessionStorage在用户关闭页面后就失效
    2. API与localStorage 一样

    来说说他们之间的区别

    Cookie和LocalStorage

    1. Cookie大小一般为4KB;localStorage一般为5MB;
    2. Cookie一般在浏览器关闭(会话结束)时就失效,后端可以设置Expires或Max-Age来改变Cookie的过期时间;LocalStorage是永久有效,除非用户手动清除;
    3. Cookie会被附加到HTTP请求中,而LocalStorage不会。

    localStorage 与 sessionStorage 的区别

    localStorage永久有效, sessionStorage在用户关闭页面(会话结束)后失效。


    Cookie 和 Session

    1. Cookie保存在用户的硬盘里,而Session是对应服务器中的一小块内存
    2. Cookie每次都会随着HTTP请求发送给服务器;而Session只需要发送保存在Cookie的SessionID即可从那个服务器中读取对应的内容
    3. Cookie以明文的形式存储,内容可被查看或篡改;Session只提供一个随机的SessionID,所以无法直接查看。

    相关文章

      网友评论

          本文标题:Cookie Session localStorage

          本文链接:https://www.haomeiwen.com/subject/vrbooftx.html