代码改变世界

javascript cookie

2013-09-02 19:54  龙恩0707  阅读(527)  评论(0编辑  收藏

   什么是cookie?

  cookie就是存储在计算机客户端中变量,每当用户游览器访问一个页面时候,就会发送一个cookie,可以用来存储用户的信息。

     从javascript角度来看,cookie就是一些字符串信息,这些信息存储在客户端计算机中,用来与服务器之间传递数据的。比如document.cookie是返回当前页面可用的(根据cookie域,路径,失效时间和安全设置)所有cookie的字符串,一系列由分号隔开的键值对,

如:name1=value1;name2=value2;name3=value3;name4=value4.

    1.cookie是有大小限制的,大多数游览器都有大约4KB的长度限制,所以我们最好控制在4095个字节范围内,假如超过这么多字节的话,那么可能超过的那部分被揭掉。

    2.cookie是存储在计算机客户端的文件中,所以cookie存储信息相对来说安全性方面比较弱,因此一些重要信息最好不要用cookie来存储。

    3. cookie是存在有效期的,一般的情况下 cookie的生命周期是:当游览器关闭的时候结束,但是当关闭时候我们还想让cookie存在于游览器中,我们可以设置个有效期,也就是说到什么时候结束。

    4. cookie有路径的概念。对应指定的域中的那个路径,应该向服务器发送cookie,比如你可以指定cookie只有从http://www.baidu.com/index下发送cookie,那么http://www.baidu.com是不能发送cookie的 即使请求都来自于同个域。那么我们怎么样让这个cookie能让父级目录及其他目录都可以访问的到呢?那么我们可以设置path在根目录下,那么不管哪个子目录创建的 都能访问到这个cookie。如下:

document.cookie = "name=tugenhua;path=/"

      5. cookie有域的概念。比如说a.example.com下的cookie,我们想要让b.example.com目录下能访问到那个a.example.com下的cookie,那要怎么办呢?我们可以如下设置:

document.cookie = "username=tugenhua;path=/;domain=example.com"

       6.cookie安全性: 通常 cookie 信息都是使用HTTP连接传递数据,这种传递方式很容易被查看,所以 cookie 存储的信息容易被窃取。假如 cookie 中所传递的内容比较重要,那么就要求使用加密的数据传输。

  所以 cookie 的这个属性的名称是“secure”,默认的值为空。如果一个 cookie 的属性为secure,那么它与服务器之间就通过HTTPS或者其它安全协议传递数据。语法如下:

document.cookie = "username=tugenhua;secure"

   把cookie设置为secure,只保证 cookie 与服务器之间的数据传输过程加密,而保存在本地的 cookie文件并不加密。如果想让本地cookie也加密,得自己加密数据。

  下面是我通过看书或者google资料看到的 设置cookie 获取cookie 删除cookie的JS代码如下:

var cookies = (function(){
    var MILLISECONDS_OF_DAY = 24 * 60 * 60 * 1000;
    var cookies = {
        getCookie: function(name){
            var cookieName = encodeURIComponent(name) + '=',
                cookieStart = document.cookie.indexOf(cookieName),
                cookieValue = null;

            if(cookieStart > -1){
                var cookieEnd = document.cookie.indexOf(';',cookieStart);
                if(cookieEnd == -1){
                    cookieEnd = document.cookie.length;
                }
                cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd));
            }
            return cookieValue;
        },

        setCookie: function(name,value,expires,path,domain,secure){
            var cookieText = encodeURIComponent(name) + '=' + encodeURIComponent(value),
                date = expires;
            
            // 从当前时间开始 到多少天后过期
            if(typeof date === 'number') {
                date = new Date();
                date.setTime(date.getTime() + expires * MILLISECONDS_OF_DAY);
            }
            if(date instanceof Date){
                cookieText += '; expires=' +date.toUTCString();
            }

            if(path) {
                cookieText += '; path=' + path;
            }

            if(domain) {
                cookieText += '; domain=' + domain;
            }

            if(secure) {
                cookieText += '; secure=' + secure;
            }
            document.cookie = cookieText;
        },
        
        removeCookie: function(name,path,domain,secure) {
            this.setCookie(name,'', new Date(0), path, domain, secure);
        }
    };

    return cookies;
})();

       getCookie方法根据cookie名字获取对应的值,然后查找cookie名加上等于号的位置,如果找到了的话 那么用indexOf方法查找该位置下的第一个分号的位置,如果没有找到分号则说明该cookie是字符串中最后一个,则余下的字符串都是cookie的值,该值使用decodeURIComponent()方法进行解码最后返回,如果没有发现cookie,则返回null.

       setCookie方法接受几个参数,name,value,expires(失效时间),path(路径),domain(域)和secure(安全性 boolean),其中name和value是必须的,其他的都是可选择的,具体的看代码。

       removeCookie方法是 根据name删除对应的cookie。name是必须的 其他的可以选择。具体的也可以看代码。