Web前端数据存储—cookie机制（设置，获取，删除cookie）

今天看到cookie机制就来记录一下，我们前端一般存储cookie都是在登录的时候进行的，两种，选一个就行(其实都一样，只不过一个明细化了)。

我们先了解一下

cookie:

HTTPCookie，通常叫做cookie，是用于客户端存储会话信息的。

例如平常我们使用的浏览器保存某个网页的登陆用户名，是浏览器提供的一种机制，交由javascript处理cookie，即BOM的document.cookie属性； Cookie在性质上是绑定在特定的域名下，当设定一个cookie后，再给创建它的域名发送请求时，都会包含这个cookie。 这个限制确保cookie只能让批准的接受者访问，而无法被其它域访问。 每个域的cookie总数是有限的，不过浏览器之间各有不同。

火狐限制50个，

IE7和之后的版本都是50个，

safari和chrome对于每个域的cookie数量限制没有硬性规定。

一、Cookie的构成：

名称：cookie的名称，不区分大小写；

值：存储在cookie中的字符串，必须被URL编码；

域：cookie对于哪个域是有效的，如果没有明确确定，那么这个域会被认作来自设置cookie的那个域。

路径：指定域中的那个路径应该向服务器发送cookie；

例如：设置http://www.wrox.com/books才能访问，

那么即使同一域名下的http://www.wrox.com的页面就不会发送cookie信息，即使请求都是来自同一域名下的。

删除时间：用于删除cookie的准确时间，这个值是个GMT格式的日期（Wdy,DD-Mon-YYYY HH:MM:SS GMT）

安全标志：指定后，cookie只有在使用SSL连接的时候菜发送到服务器。例如只能用https而不能用http发送。

二、javascript处理cookie

Cookie格式：

Document.cookie = name = value;

expires = expiration_time;

path = domain_path;

domain = domain_name; 只有名字和值键值对是必须的

例如：把 name = sss, 时间1天，域名为www.baidu.com,

路径为www.baidu.com/books;

Document.cookie = " name = sss "; expires = (Date.getDate()+1243600*1000).toGMTString(); domain = www.baidu.com; path = “www.baidu.com/books”;

这样的读写很不直观，一般会写些函数来简化cookie的功能；基本的三种操作：设置，读取，删除。 第一种

第二种 项目中登录时进行cookie 值 存 取。以element ui框架为例

//样式就自己写吧