Cookie在Web项目中的应用

一、cookie概述

JavaScript中的另一个机制：cookie，则可以达到真正全局变量的要求。

cookie是浏览器提供的一种机制，它将document对象的cookie属性提供给JavaScript。可以由JavaScript对其进行控制，而并不是JavaScript本身的性质。cookie是存于用户硬盘的一个文件，这个文件通常对应于一个域名，当浏览器再次访问这个域名时，便使这个cookie可用。因此，cookie可以跨越一个域名下的多个网页，但不能跨越多个域名使用。

不同的浏览器对cookie的实现也不一样，但其性质是相同的。例如在Windows 2000以及Windows xp中，cookie文件存储于documents and settings\userName\cookie\文件夹下。通常的命名格式为：[e-mail]。

cookie机制将信息存储于用户硬盘，因此可以作为全局变量，这是它最大的一个优点。它可以用于以下几种场合。

1、保存用户登录状态。例如将用户id存储于一个cookie内，这样当用户下次访问该页面时就不需要重新登录了，现在很多论坛和社区都提供这样的功能。cookie还可以设置过期时间，当超过时间期限后，cookie就会自动消失。因此，系统往往可以提示用户保持登录状态的时间：常见选项有一个月、三个月、一年等。

2、 跟踪用户行为。例如一个天气预报网站，能够根据用户选择的地区显示当地的天气情况。如果每次都需要选择所在地是烦琐的，当利用了cookie后就会显得很人性化了，系统能够记住上一次访问的地区，当下次再打开该页面时，它就会自动显示上次用户所在地区的天气情况。因为一切都是在后台完成，所以这样的页面就像为某个用户所定制的一样，使用起来非常方便。

3、 定制页面。如果网站提供了换肤或更换布局的功能，那么可以使用cookie来记录用户的选项，例如：背景色、分辨率等。当用户下次访问时，仍然可以保存上一次访问的界面风格。

4、 创建购物车。正如在前面的例子中使用cookie来记录用户需要购买的商品一样，在结账的时候可以统一提交。例如淘宝网就使用cookie记录了用户曾经浏览过的商品，方便随时进行比较。

当然，上述应用仅仅是cookie能完成的部分应用，还有更多的功能需要全局变量。cookie的缺点主要集中于安全性和隐私保护。主要包括以下几种：

1、 cookie可能被禁用。当用户非常注重个人隐私保护时，他很可能禁用浏览器的cookie功能；

2、 cookie是与浏览器相关的。这意味着即使访问的是同一个页面，不同浏览器之间所保存的cookie也是不能互相访问的； 

3、 cookie可能被删除。因为每个cookie都是硬盘上的一个文件，因此很有可能被用户删除；

4、cookie安全性不够高。所有的cookie都是以纯文本的形式记录于文件中，因此如果要保存用户名密码等信息时，最好事先经过加密处理。

二、通过JS实现（纯客户端）

1、创建（设置）cookie

每个cookie都是一个名/值对，可以把下面这样一个字符串赋值给document.cookie： document.cookie="userId=828"; 如果要一次存储多个名/值对，可以使用分号加空格（; ）隔开，例如： document.cookie="userId=828; userName=hulk"; 在cookie的名或值中不能使用分号（;）、逗号（,）、等号（=）以及空格。在cookie的名中做到这点很容易，但要保存的值是不确定的。如何来存储这些值呢？方法是用escape()函数进行编码，它能将一些特殊符号使用十六进制表示，例如空格将会编码为“%20”，从而可以存储于cookie值中，而且使用此种方案还可以避免中文乱码的出现。例如： document.cookie="str="+escape("I love ajax"); 相当于： document.cookie="str=I%20love%20ajax"; 当使用escape()编码后，在取出值以后需要使用unescape()进行解码才能得到原来的cookie值。 尽管document.cookie看上去就像一个属性，可以赋不同的值。但它和一般的属性不一样，改变它的赋值并不意味着丢失原来的值，例如连续执行下面两条语句： document.cookie="userId=828"; document.cookie="userName=hulk"; 这时浏览器将维护两个cookie，分别是userId和userName，因此给document.cookie赋值更像执行类似这样的语句： document.addCookie("userId=828"); document.addCookie("userName=hulk"); 事实上，浏览器就是按照这样的方式来设置cookie的，如果要改变一个cookie的值，只需重新赋值，例如： document.cookie="userId=929"; 这样就将名为userId的cookie值设置为了929。

2、获取cookie的值

cookie的值可以由document.cookie直接获得：var strCookie=document.cookie; 这将获得以分号隔开的多个名/值对所组成的字符串，这些名/值对包括了该域名下的所有cookie。 由此可见，只能够一次获取所有的cookie值，而不能指定cookie名称来获得指定的值，这正是处理cookie值最麻烦的一部分。用户必须自己分析这个字符串，来获取指定的cookie值。

  3、给cookie设置终止日期

到现在为止，所有的cookie都是单会话cookie，即浏览器关闭后这些cookie将会丢失，事实上这些cookie仅仅是存储在内存中，而没有建立相应的硬盘文件。 在实际开发中，cookie常常需要长期保存，例如保存用户登录的状态。这可以用下面的选项来实现：document.cookie="userId=828; expires=GMT_String"; 其中GMT_String是以GMT格式表示的时间字符串，这条语句就是将userId这个cookie设置为GMT_String表示的过期时间，超过这个时间，cookie将消失，不可访问。

  4、删除cookie

为了删除一个cookie，可以将其过期时间设定为一个过去的时间.

  5、指定可访问cookie的路径

默认情况下，如果在某个页面创建了一个cookie，那么该页面所在目录中的其他页面也可以访问该cookie。如果这个目录下还有子目录，则在子目录中也可以访问。例如在www.xxxx.com/html/a.html中所创建的cookie，可以被www.xxxx.com/html/b.html或www.xxx.com/ html/ some/c.html所访问，但不能被www.xxxx.com/d.html访问。 为了控制cookie可以访问的目录，需要使用path参数设置cookie，语法如下： document.cookie="name=value; path=cookieDir"; 其中cookieDir表示可访问cookie的目录。例如： document.cookie="userId=320; path=/shop"; 就表示当前cookie仅能在shop目录下使用。 如果要使cookie在整个网站下可用，可以将cookie_dir指定为根目录，例如： document.cookie="userId=320; path=/";

6、指定可访问cookie的主机名

和路径类似，主机名是指同一个域下的不同主机，例如：www.google.com和gmail.google.com就是两个不同的主机名。默认情况下，一个主机中创建的cookie在另一个主机下是不能被访问的，但可以通过domain参数来实现对其的控制，其语法格式为： document.cookie="name=value; domain=cookieDomain"; 以google为例，要实现跨主机访问，可以写为： document.cookie="name=value;domain=.google.com"; 这样，所有google.com下的主机都可以访问该cookie。

7、综合示例：构造通用的cookie处理函数 cookie的处理过程比较复杂，并具有一定的相似性。因此可以定义几个函数来完成cookie的通用操作，从而实现代码的复用。下面列出了常用的cookie操作及其函数实现。

（1）．添加一个cookie：addCookie(name,value,expireHours) 该函数接收3个参数：cookie名称，cookie值，以及在多少小时后过期。这里约定expireHours为0时不设定过期时间，即当浏览器关闭时cookie自动消失。该函数实现如下： <script language="JavaScript" type="text/javascript"> <!-- function addCookie(name,value,expireHours){       var cookieString=name+"="+escape(value);       //判断是否设置过期时间       if(expireHours>0){              var date=new Date();              date.setTime(date.getTime+expireHours*3600*1000);              cookieString=cookieString+"; expire="+date.toGMTString();       }       document.cookie=cookieString; } //--> </script>

（2）．获取指定名称的cookie值：getCookie(name) 该函数返回名称为name的cookie值，如果不存在则返回空，其实现如下： <script language="JavaScript" type="text/javascript"> <!-- function getCookie(name){       var strCookie=document.cookie;       var arrCookie=strCookie.split("; ");       for(var i=0;i<arrCookie.length;i++){             var arr=arrCookie[i].split("=");             if(arr[0]==name)return unescape(arr[1]);       }       return ""; } //--> </script>

( 3)．删除指定名称的cookie：deleteCookie(name) 该函数可以删除指定名称的cookie，其实现如下： <script language="JavaScript" type="text/javascript"> <!-- function deleteCookie(name){        var date=new Date();        date.setTime(date.getTime()-10000);        document.cookie=name+"=v; expire="+date.toGMTString(); } //--> </script> 

8、在HTML中的加载

情形一：加载用户名等登陆信息到表单如：HTML部分：<body onload="ok()">JS部分：<script language="JavaScript" type="text/javascript"> <!--function ok(){  document.form.user.value=getCookie();}//--> </script>

情形二：加载Cookie信息到页面进行显示HTML部分：<script  language ="JavaScript"> printName(); </script>JS部分：<script language="JavaScript" type="text/javascript"> <!--function printName(){          document.write(getCookie(“name”)); }//--> </script> 

二、通过JSP实现（服务器端）1、创建Cookie＜%
String cookieName="Sender";
Cookie cookie=new Cookie(cookieName, "Test_Content");
cookie.setMaxAge(10);
response.addCookie(cookie);
%＞我们来仔细研究一下这段代码：Cookie cookie=new Cookie(cookieName, "Test_Content"); 这一行建立了一个Cookie对象，初始化有两个参数，第一个参数cookieName定义了Cookie的名字，后一个参数，也是一个字符串，定义了Cookie的内容。也就是我们希望网页在用户的机器上标识的文件内容。 接下来一行：cookie.setMaxAge(10)，调用了Cookie中的setMaxAge方法，设定Cookie在用户机器硬盘上的存活期为10秒。一个Cookie在用户的硬盘里面存在的时间并不是无限期的，在建立Cookie对象的时候，我们必须制定Cookie的存活期，超过了这个存活期后，Cookie文件就不再起作用，会被用户的浏览器自行删除。如果我们希望用户在下次访问这个页面的时候，Cookie文件仍然有效而且可以被网页读出来的话，我们可以将Cookie的存活期设得稍微长一些。比如cookie.setMaxAge(365*24*60*60)可以让Cookie文件在一年内有效。

2、读出Cookie值＜%
Cookie cookies[]=request.getCookies();
Cookie sCookie=null;
String svalue=null;
String sname=null;
for(int i=0;i< cookies.length;i++){
sCookie=cookies[i];
svalue=sCookie.getValue();
sname=sCookie.getName();
}
%＞
＜%=name%＞ ＜%=svalue%＞         用sCookie.getValue()和sCookie.getName()两个方法来取得这个Cookie的名字和内容。

3、注意问题

（1）. Cookie的兼容性问题 Cookie的格式有2个不同的版本，第一个版本，我们称为Cookie Version 0，是最初由Netscape公司制定的，也被几乎所有的浏览器支持。而较新的版本，Cookie Version 1，则是根据RFC 2109文档制定的。为了确保兼容性，JAVA规定，前面所提到的涉及Cookie的操作都是针对旧版本的Cookie进行的。而新版本的Cookie目前还不被Javax.servlet.http.Cookie包所支持。

（2）. Cookie的内容 同样的Cookie的内容的字符限制针对不同的Cookie版本也有不同。在Cookie Version 0中，某些特殊的字符，例如：空格，方括号，圆括号，等于号（=），逗号，双引号，斜杠，问号，@符号，冒号，分号都不能作为Cookie的内容。这也就是为什么我们在例子中设定Cookie的内容为"Test_Content"的原因。
虽然在Cookie Version 1规定中放宽了限制，可以使用这些字符，但是考虑到新版本的Cookie规范目前仍然没有为所有的浏览器所支持，因而为保险起见，我们应该在Cookie的内容中尽量避免使用这些字符，或者进行转换。

参阅：[1]：JavaScript使用cookie[2]：用JSP操作Cookie[3]：js中几种去掉字串左右空格的方法