2

概述

虽说在现代Web开发过程中讨论Cookie有些不合时宜,但是这是开发人员如今可以使用的最古老、最稳定的客户端存储形式。当然,我们并不推荐使用Cookie,只是说它是一种选择。

Cookie于1994年在Netscape浏览器的Beta版本中被引入。它通过随HTTP请求和响应一起发送的HTTP header值发挥作用。众所周知,每当浏览器请求一个资源,就会有一组header随请求一起发送。那些header包含各种类型的数据,其中包括有关浏览器的信息以及它需要的数据形式。反过来,服务器也会往回发送header。

Cookie使用HTTP header发送,具体来说是名为Cookie的HTTP header,由浏览器发送到服务器,又从服务器发送到浏览器。你会发现这里有个问题。如果使用客户端存储的一个好处是不用通过网络发送数据,那么来回发送Cookie不是反其道而行之吗?这也是上面提到的不建议使用Cookie的另一个原因。

默认情况下,浏览器没有限制可以拥有的Cookie数量。以前,每个域名最多只能有20个Cookie,但如今的浏览器似乎丢掉了这个限制。

Cookie对应唯一的域名。这意味着在foo.com上设置的Cookie值不能用于goo.com.这样很好,因为你不会希望其他网站影响你在自己的网站上使用Cookie。
Cookie也可以对应唯一的子域名。例如,app.foo.com是Foo网站的一个独立的子域名。你可以创建只有app.foo.com可以读取的Cookie,也可以创建www.foo.com和app.foo.com都可以读取的Cookie。
更复杂的做法是创建只对特定路径有效的Cookie。所以,你可能希望创建只有foo.com/app可见的Cookie。
最后,你可以创建只对网站的安全(HTTPS)版本有效的Cookie。显然,选用哪种方案取决于应用程序的用途,以及你认为哪里需要Cookie值。

除了设置Cookie出现的地方,还可以指定Cookie的有效时间。

  • 只在当前会话期间存在的Cookie(从根本上说是直到浏览器关闭)
  • 永远存在的Cookie
  • 存在特定时长的Cookie
  • 特定时间点之后失效的Cookie

使用方法

Cookie没有API。要使用Cookie,只需在代码中访问document.cookie对象。例如,可以像下面一样创建一个Cookie.

document.cookie = "name=zuckjet"

Cookie值必须符合URL编码规则,这意味着如果想动态定义Cookie,那么就需要使用类似encodeURIComponent的辅助函数。
下面这段代码世家还是那个创建了两个Cookie,而不是一个。

document.cookie = "name=zuckberg";
document.cookie = "age=18";

在Cookie值后面使用一个分号可以追加元数据:

documen.cookie = "name=zuckjet;expires=xxx;domain=xxx"

当我们不指定元数据时,Cookie默认只对当前域名的当前路径有效,有效期是当前会话。

读取Cookie

读取Cookie多少简单一些--这取决于你对字符串的解析程度。没有API可以用来获取一个Cookie。不过,你只需要简单地读取document.cookie就可以了。这样你可以获取特定网站的Cookie。比如,segmentfault的cookie值如下:

clipboard.png

读取一个Cookie就意味着将字符串解析成多个有分号分隔的部分。另外还要注意,你无法访问任何元数据。通过document.cookie值无法获取这类信息。

删除Cookie

要删除Cookie,只需要将其过期时间设置成过去的时间即可。从技术上讲,这个时间值无关紧要,但名称必须与你想要删除的Cookie名称一致。


Zuckjet
437 声望657 粉丝

学如逆水行舟,不进则退。


下一篇 »
Web存储