HTTP——Cookie LocalStorage SessionStorage

Cookie LocalStorage SessionStorage

使用cookie注册登录过程

注册

首先用户注册时，会打开注册页面，在打开页面的过程是get过程，如果服务器有这个路由设置，就会发出响应返回给浏览器一个响应，于是注册页面就显示在浏览器上。
当用户要进行注册时，首先浏览器会向服务器发出一个post请求,将自己在页面中输入账号，密码，确认密码，发送到服务器中（密码账号格式可以用js进行判断，也可以在服务器中进行判断，），服务器收到账号和密码时，首先要判断在数据库中账号是否存在，两次密码是否相同，两种都成功，才将账号和密码存入数据库中，并且返回状态码200，表示注册成功

登录

用户打开登录页面，输入账号和密码，点登录时会发向服务器出post请求，服务端读取数据库中的账号密码，进行判断，该账号和密码是否是上次注册的。如果成功，则登录成功进入首页，此时服务器返回一个cookie（设置为用户名的cookie）给浏览器，这个cookie有一定的时间期限（一般是20分钟）。下一次用户再访问当前首页时，首先浏览器会带上cookie,服务器首先会读取cookie，来判断此用户是不是上次cookie后的用户，如果是则会访问到自己的个人存储的隐私信息如（姓名，电话等），如果用户没有cookie,则进入一个公共的页面，要访问私有信息，必须要登录。

Cookie

• Cookie的特点
  服务器通过Set-Cookie 响应头设置Cookie，浏览器得到Cookie后，每次请求都要带上Cookie,服务器读取Cookie就知道用户登录的信息
  浏览器请求资源时，会默认带上对应域名的cookie，如我请求qq.com的cookie不会带上baidu.com对应的cookie;
  在windows系统中一般存在C盘的一个文件中

• 存在的问题
  Cookie会被用户篡改，如果获取了用户的Cookie值，通过手动更改自己浏览器的Cookie值就可以访问到该用户的隐私。

• 解决方法
  为了防止用户篡改cookie，服务器可以利用Session,Session是基于Cookie实现的,通过cookie向客户端发送SessionID,服务器中有一块内存，存储了所有用户的Session，每次用户访问服务器时，服务器通过SessionID去读取Session，就知道用户的隐私信息。

• Cookie 和 LocalStorage 的区别

• Cookie
  在客户端访问同个域名时，将会带上上一次存储下来的Cookie，大小大约为4kb，浏览器默认页面关闭后消失。

• LocalStorage
  和HTTP无关，客户端访问同个域名时不会带上LocalStorage，每个域名最大存储空间大约为5M，LocalStorage存储在客户端中只要你不删，永久存储。有getItem,setItem,removeItem等方法，setItem用于向LocalStorage写东西，getItem用于LocalStorage获取东西。用途：如一个网站更新，用户第一次进入alert出，该网站更新了一些新内容等等，并设定设定一个值 flag 为true通过getItem存如LocalStorage，下次加载时首先查看LocalStorage中flag是否存在并为true，则就判断是否提醒。

• LocalStorage 和 SessionStorage 的区别
  SessionStorage在页面关闭后会消失，LocalStorage永久有效。其余的和LocalStorage一样。

缓存

• Cache-Control
  可以通过max-age来设置缓存存在的时间，Cache-Control的max-age = 1000，表示加载了该缓存后，在1000秒内再次请求同一个URL时就停止请求，直接使用上一次缓存，不用重新向服务器请求下载。Expires和Cache-Control同时出现，优先执行Cache-Control。

• ETag
  是在请求后，此次请求头If-None-Match的值与ETag值一致，则不再进行加载新的请求文件，直接从缓存中拿。状态码为304，每次都有请求，但相应是没有第四部分的，为空。

• Expires
  是设定缓存到期的时间，如 ‘Expires’,‘Wed Aug 14 2019 20:29:56 GMT+0800’,表示时间到了设定时间后，需要重新向服务器请求。