前端开发本地存储之cookie

1、cookie

cookie是纯文本,没有可执行代码,是指某些网站为了辨别用户身份、进行 session 跟踪而储存在用户本地终端(浏览器)上的数据(通常经过加密)。当用户访问了某个网站的时候,我们就可以通过cookie在访问者电脑上存储数据,或者某些网站为了辨别用户身份、进行session 跟踪而将数据储存在用户本地终端上(通常经过加密)。

cookie 默认是临时存储的,当浏览器关闭进程的时候自动销毁。要想长时间保存一个cookie,就需要设置cookie的过期时间。当 Web 服务器创建了Cookies 后,只要在其有效期内,用户访问同一个 Web 服务器时,浏览器首先要检查本地的Cookies,并将其原样发送给 Web 服务器。cookie是能保持 Web 浏览状态的手段。

2、cookie的工作过程

当网页要发 http 请求时,浏览器会先检查是否有相应的 cookie,有则自动添加在request header中的cookie字段中。这些是浏览器自动帮我们做的,而且每一次http请求浏览器都会自动帮我们做。

存储在cookie中的数据,每次都会被浏览器自动放在http请求中。如果这些数据并不是每个请求都需要发给服务端的数据,浏览器这设置自动处理无疑增加了网络开销。但如果这些数据是每个请求都需要发给服务端的数据(比如身份认证信息),浏览器这设置自动处理就大大免去了重复添加操作。所以对于那种设置“每次请求都要携带的信息(最典型的就是身份认证信息)”就特别适合放在cookie中,其他类型的数据就不适合了。

工作过程:

(1)首先,我们假设当前域名下还是没有 Cookie 的

(2)接下来,浏览器发送了一个请求给服务器(这个请求是还没带上 Cookie 的)

(3)服务器设置 Cookie 并发送给浏览器(当然也可以不设置)

(4)浏览器将 Cookie 保存下来

(5)接下来,以后的每一次请求,都会带上这些 Cookie,发送给服务器

3、cookie的特征

(1)不同的浏览器存放的cookie位置不一样,也是不能通用的。

(2)cookie的存储是以域名形式进行区分的,在同一浏览器下不同的域名下存储的cookie是独立的。

(3)cookie也可以设置过期的时间,默认是会话结束的时候,当时间到期自动销毁

(4)一个浏览器能创建的 Cookie 数量最多为 300 个,并且每个不能超过 4KB,每个 Web 站点能设置的 Cookie 总数不能超过 20 个

(5)我们可以设置cookie生效的域(当前设置cookie所在域的子域),也就是说,我们能够操作的cookie是当前域以及当前域下的所有子域

(6)cookie 必须在 HTML 文件的内容输出之前设置。如果用户在浏览器上设置了禁止 Cookie,则 Cookie 不能建立。

4、cookie的设置

4.1、在客户端设置

document.cookie = '名字=值';
document.cookie = 'username=cfangxu;domain=baike.baidu.com'    //并且设置了生效域

注意: 客户端可以设置cookie 的下列选项:expires、domain、path、secure(有条件:只有在https协议的网页中,客户端设置secure类型的 cookie 才能成功),但无法设置HttpOnly选项。

4.2、在服务器端设置

不管你是请求一个资源文件(如 html/js/css/图片),还是发送一个ajax请求,服务端都会返回response。而response header中有一项叫set-cookie,是服务端专门用来设置cookie的。

Set-Cookie 消息头是一个字符串,其格式如下(中括号中的部分是可选的):
Set-Cookie: value[; expires=date][; domain=domain][; path=path][; secure]

注意: 一个set-Cookie字段只能设置一个cookie,当你要想设置多个 cookie,需要添加同样多的set-Cookie字段。 
服务端可以设置cookie 的所有选项:expires、domain、path、secure、HttpOnly。通过 Set-Cookie 指定的这些可选项只会在浏览器端使用,而不会被发送至服务器端。

5、cookie的域概念

猜你喜欢

转载自www.cnblogs.com/wenxuehai/p/10470716.html
今日推荐