浏览器储存

2018-09-20  本文已影响0人  Cissy_fba3

cookie sessionStorage localStorage
cookie
Cookie指某些网站为了辨别用户身份而储存在用户本地终端上的数据(通常经过加密)。 cookie是服务端生成,客户端进行维护和存储。通过cookie,可以让服务器知道请求是来源哪个客户端,就可以进行客户端状态的维护,比如登陆后刷新,请求头就会携带登陆时response header中的set-cookie,Web服务器接到请求时也能读出cookie的值,根据cookie值的内容就可以判断和恢复一些用户的信息状态

Session:服务器通过cookie给用户一个sessionId,sessionId对应服务器里面的一小块内存,每次用户访问服务器的时候,服务器就通过sessionId去读取相应的session来得到用户的隐私信息。
sessionId是个随机数,所以不能被用户修改


1.Cookie 和 Session 的区别
一般来说,Session 基于 Cookie 来实现。
Cookie

  1. 服务器通过 Set-Cookie 头给客户端一串字符串
  2. 客户端每次访问相同域名的网页时,必须带上这段字符串
  3. 客户端要在一段时间内保存这个Cookie
  4. Cookie 默认在用户关闭页面后就失效,后台代码可以任意设置 Cookie 的过期时间
  5. 大小大概在 4kb 以内

Session(不翻译)

  1. 将 SessionID(随机数)通过 Cookie 发给客户端
  2. 客户端访问服务器时,服务器读取 SessionID
  3. 服务器有一块内存(哈希表)保存了所有 session
  4. 通过 SessionID 我们可以得到对应用户的隐私信息,如 id、email
  5. 这块内存(哈希表)就是服务器上的所有 session

2.Cookie 和 LocalStorage 的区别

(localStorage:html5提供的一个API,存在Windows用户的c盘的一个文件里
在没有localStorage之前,所有的变量在页面刷新之前都全部销毁)
cookie会被带到服务器上去,locaStorage不会
LocalStorage

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

3.LocalStorage 和 SessionStorage 的区别
SessionStorage(会话存储)
1、2、3、4 同locaStorage
5.SessionStorage 在用户关闭页面(会话结束)后就失效。

4.Cookie 如何设置过期时间?如何删除 Cookie?
cookie过期时间设置方式
cookie.setMaxAge(0);//不记录cookie
cookie.setMaxAge(-1);//会话级cookie,关闭浏览器失效
cookie.setMaxAge(60*60);//过期时间为1小时

5.Cache-Control: max-age=1000 缓存 与 ETag 的「缓存」有什么区别?

答:Cache-Control直接不请求,ETag直接不下载,但是还是要请求(响应体是空的)


如何让页面的css和JS加快?
cache-control(缓存)

cache-control.png

通过设置max-age来设置过期时间,通常是一年加的时间

max-age.png

通过在js和css路径上加查询参数来更新js和css
注意:cache-control一般不用在首页的html上

Expires:

expires.png

cache-control和expires的区别:前者是一段时间后过期,后者是什么时候(准确的时间)过期;
用cache-control不用Expires的原因:后者的时间只的是本地时间,一旦本地时间错乱,就会停用


浏览器储存.png
上一篇下一篇

猜你喜欢

热点阅读