Cookie小讲座

[图片上传失败...(image-b5901d-1536505633922)]

1.Cookie是什么

有了解HTTP协议的小伙伴,应该都知道HTTP是无状态协议,是不记录状态。换句话说,无论你客户端向同一个服务器发送多少个请求,服务器都不知道你是谁。如果是这样,那么我们需要登录,买买买的购物车,就无法实现啦。现在就引出我们的Cookie,Cookie就是为了解决这个问题而生的。

What is the Cookie?(Web开发里Cookie的含义)
1.Cookie是浏览器访问服务器后,服务器传给浏览器的一段数据
2.浏览器需要保存这段数据,不得轻易删除
3.此后每次浏览器访问该服务器的时候,都必须带上这段数据

2.Cookie的作用

Cookie一般有两个作用。
1.用来识别用户身份

比如用户A用浏览器访问了http://a.com,那么http://a.com的服务器就会立刻给A返回一段数据[auth:A](这就是Cookie)。当A再次访问http://a.com时,就会带上这段数据。

同理,用户B用浏览器访问了http://a.com,那么http://a.com的服务器就会立刻给A返回一段数据[auth:B]。当B再次访问http://a.com时,就会带上这段数据。

2.记录历史
假设http://a.com是一个购物网站,当A在上线将商品A,商品B放入购物车时,JS可以改写Cookie,改为[auth:B;cart=A,B],表示购物车里有A和B这两样商品。这样一来,当用户关闭网页,过几天再打开该网页的时候,依然可以看到A,B沉睡在购物上中,因为,此前文章有提到,浏览器不得轻易删除Cookie。借此,我们就可以达到记录用户操作的目的。

3.Cookie的使用

1:在服务器端
Web 服务器通过发送一个称为 Set-Cookie 的 HTTP 消息头来创建一个 cookie,Set-Cookie 消息头是一个字符串,其格式如下(中括号中的部分是可选的):

Set-Cookie: value[; expires=date][; domain=domain][; path=path][; secure]

value
消息头的第一部分,value 部分,通常是一个 name=value 格式的字符串。事实上,这种格式是原始规范中指定的格式,但是浏览器并不会对 cookie 值按照此格式来验证。实际上,你可以指定一个不含等号的字符串,它同样会被存储。然而,最常用的使用方式是按照 name=value 格式来指定 cookie 的值(大多数接口只支持该格式)。

过期时间选项
过期时间选项,在set-cookie中,我们可以通过expires或者max-age设置,expires的时间格式一般遵循Wdy, DD-Mon-YYYY HH:MM:SS GMT 日期格式的值,而max-age是以秒为单位,另外值得注意的是max-age的权限大于expires。
max-age:指的是在服务器发送Cookie给浏览器后,如果Cookie存在时间超过max-age设置的时间,则浏览器必须删除Cookie,反之。
expires:指的是在服务器发送Cookie给浏览器后,如果Cookie存在时间超过expires设置的日期,则浏览器必须删除Cookie,反之。

domain 选项
下一个选项是 domain,指定了 cookie 将要被发送至哪个域中。默认情况下,domain 会被设置为创建该 cookie 的页面所在的域名,所以当给相同域名发送请求时该 cookie 会被发送至服务器。例如,本博中 cookie 的默认值将是 sheldonyee.com。domain 选项可用来扩充 cookie 可发送域的数量,例如:

Set-Cookie: name=Sheldon; domain=sheldonyee.com

path 选项
另一个控制 Cookie 消息头发送时机的选项是 path 选项,和 domain 选项类似,path 选项指定了请求的资源 URL 中必须存在指定的路径时,才会发送Cookie 消息头。这个比较通常是将 path 选项的值与请求的 URL 从头开始逐字符比较完成的。如果字符匹配,则发送 Cookie 消息头,例如:

    
Set-Cookie:name=Sheldon;path=/blog

secure 选项(没有使用)
最后一个选项是 secure。不像其它选项,该选项只是一个标记而没有值。只有当一个请求通过 SSL 或 HTTPS 创建时,包含 secure 选项的 cookie 才能被发送至服务器。这种 cookie 的内容具有很高的价值,如果以纯文本形式传递很有可能被篡改,例如:

    
Set-Cookie: name=Sheldon; secure

事实上,机密且敏感的信息绝不应该在 cookie 中存储或传输,因为 cookie 的整个机制原本都是不安全的。默认情况下,在 HTTPS 链接上传输的 cookie 都会被自动添加上 secure 选项。

HttpOnly
这个选项比较简单,就是禁止前端用代码取得Cookie;

没有设置HttpOnly
前端:document.cookie = authd=Sheldon

设置HttpOnly
前端:document.cookie = ''

2.前端的Cookie
在 JavaScript 中通过 document.cookie 属性,你可以创建、维护和删除 cookie。创建 cookie 时该属性等同于 Set-Cookie 消息头,而在读取 cookie 时则等同于 Cookie 消息头。在创建一个 cookie 时,你需要使用和 Set-Cookie 期望格式相同的字符串:

document.cookie="name=Sheldon;domain=sheldonyee.com;path=/blog";

设置 document.cookie 属性的值并不会删除存储在页面中的所有 cookie。它只简单的创建或修改字符串中指定的 cookie。下次发送一个请求到服务器时,通过 document.cookie 设置的 cookie 会和其它通过 Set-Cookie 消息头设置的 cookie 一并发送至服务器。这些 cookie 并没有什么明确的不同之处

总结

这篇文章简单阐述了Cookie和Cookie选项的含义,作为自己的学习笔记使用。

你可能感兴趣的:(Cookie小讲座)