cookie ,localStorage 及其他代替方案

cookie 分两种

1. 没有设置expires的被称为会话cookie , 保存在内存中, 浏览器窗口关闭即销毁
2. 设置了expires的cookie 保存在硬盘中, 可以在不同的浏览器进程中共享

cookie 有这样几个特点

• cookie 主要作用是保存用户信息, 比如存好session id 或者 token 用来和服务器保持登录状态
• 设置httpOnly 保证cookie的安全性, 不被XSS攻击
• cookie 因为每次http请求都会携带, 能精简则精简 总大小不能超过4kb
• cookie 有效期在 sessionUtils工具中设置为两小时 勾选了自动登录则是一周时间

cookie有以下分类 ( 常见cookie )

• cookie_connect
  • 94字节 获取接口数据必须的标识 任何链接发起在app.js经过解密发送给后端
• cookie_userip
  • 26字节 用户IP, 获取接口数据必须的标识 每次都会重新获取 同时用来记录防刷数据
• cookie_tokenkey
  • 79字节 登录令牌 判断是否登录
• cookie_userid
  • 18字节 用户ID标识
• cookie_autokey
  • 46字节 可能设置为空 是否自动登录

id + token + autokey 共同发送与服务器建立session, 每次登录重设有效期

• debug_signal
  • 15字节 调试信号
• cookie_flag
  • 如果没有flag, 正常访问页面, 不统计
• cookie_cnt
  • 统计30秒内 刷新了几次

各个路由里控制广告浮层的cookie, 均为11字节左右

• 首页

  • home_ad_fc 广告浮层 24小时
  • showIe7_fc IE7浏览器提示 24小时

• 理财

  • bill_fc 活动弹窗浮层

• 挖宝藏

  • sundayFc 周一到周日只显示一次

• 娱乐大厅

  • play_ad_fc 广告浮层

推广注册页 url : /floor/spread/:id

• cookie_recoms 18字节 推广人的ID 用于注册时发送
  还有QQ 登录绑定功能

还有一些其他站点统计用cookie (未统计)

代替cookie 的方法

1. Etag 可以应用于禁用cookie的页面

1. 客户端请求一个页面（A）。
2. 服务器返回页面A，并在给A加上一个ETag。 // 告诉浏览器要弹窗的截止时间
3. 客户端展现该页面，并将页面连同ETag一起缓存。
4. 客户再次请求页面A，并将上次请求时服务器返回的ETag一起传递给服务器。 // 把弹窗截止时间发送回来
5. 正常情况, 服务器检查该ETag，并判断出该页面自上次客户端请求之后还未被修改，直接返回响应304（未修改——Not Modified）和一个空的响应体。
6. 在广告浮层业务上, 判断是否达到截止时间, 如果到了截止时间, 就重新设置etag

        var extime = new Date().getTime() + 600000; // 新的过期时间, 比如一分钟后
        var reqTime = req.headers['if-none-match'] || 0;   // 原来的过期时间
        reqTime = Number(reqTime);
        if (reqTime !== 0 && reqTime > new Date().
          res.setHeader('Etag', reqTime);  // 还没过期, 就还设置原来的时间
        } else {
          // 过期了
          res.setHeader('Etag', extime);
          console.log('设置etag, 过期时间是', extime, new Date(extime).getMinutes(), new Date(extime).getSeconds());
        }

2. 不能彻底清除的evercookie

https://www.npmjs.com/package/evercookie
这个插件可以把cookie存在各个地方(大概8个), 简单禁用cookie和清除是不能清除的

3. 每次请求url加一个参数控制广告浮层

4. localStorage 控制广告浮层

1. localStorage 仅在浏览器端保存, 不主动参与和服务器的通信, 用来保存登录表示之类的存在安全隐患
2. 写一个共用js, 进入一个页面即取出localStorage循环遍历一下对应的key,value
3. 如果value已经过期, 那么弹窗

未来应用场景

因为HTTP是无状态的协议

即不能把客户的本次链接与上次链接产生联系,所以我们需要cookie来存储上次链接会话中信息的东西

那么一切有关用户信息的数据, 能增强用户体验的信息, 都有可能存到 cookie 或 localStorage

• 广告浮层相关业务
• 用户的地理位置
• 进入页面后自动跳到上次浏览的位置
• 把最大化的窗口变小时变成用户手动控制过的窗体宽高信息
• 用户上次登录网站的时间