JS技术

JavaScript中的cookie详解

字号+ 作者: 来源: 2014-11-16 22:20 我要评论( )

JavaScript中的cookie详解

      以前,JavaScript完全不与服务器进行任何交互。它有时在客户端进行少量操作,然后让服务器来完成其他任务。然而,随着Web的发展,也要求JavaScript能向服务器发送数据,接受响应,在这种需求下就产生两种与服务器通信的方法:cookie与HTTP请求。
      cookie其实就是网站放在用户机器上的一小块信息,cookie对于用户来说是唯一的,网站可判断用户上次访问网站的时间,以及他访问了哪些页面,可用于在某个网站跟踪你访问的页面,但无法用它来获取个人信息。cookie是第一个JavaScript可以利用的客户端—服务器端之间的交互手段。浏览器向服务器发送请求时,为这个服务器存储的cookie会与其他信息一起发送到服务器。
     (一) cookie的组成
      1、名称——每一个cookie由一个唯一的名称代表。这个名称可以包含字母、数字和下划线。与JavaScript的变量不同,cookie的名称是不区分大小写的。建议将cookie名字认为是区分大小写的,因为有些服务器端软件是区分大小写的。
      2、值——保存在cookie中的字符串值。这个值在存储之前必须用encodeURIComponent()对其进行编码,以免丢失了数据或占用了cookie。名称和值加起来的字节数不能超过4KB。

      3、域——出于安全考虑,网站不能访问由其他域创建的cookie。创建cookie后,域的信息会作为cookie的一部分存储起来。
      4、路径——另一个cookie的安全特性,路径限制了对Web服务器上的特定目录的访问。例如,可指定cookie只能从http://www.yiiiyaa.net/category中访问,这样就不能访问http://www.yiiyaa.net/上的网页了,尽管都在同一个域中。
      5、失效日期——cookie何时应该被删除。默认情况下,关闭浏览器,时即将cookie删除;不过,也可以自己设置删除时间。这个值是GMT格式的日期,用于指定应该删除cookie的准确时间。因此,cookie可以浏览器关闭后依然保存在用户的机器上。如果你设置的失效日期是个以前的时间,则cookie被立即删除。
      6、安全标志——一个true/false值,用于表示cookie是否只能从安全网站(使用SSL和https协议的网站)中访问。可以将这个值设置为true以提供加强的保护,进而确保cookie不被其他网站访问。
     (二)其他安全限制
      为确保cookie不被恶意使用,浏览器还对cookie的使用进行了一些限制:
      1、每个域最多只能在一台用户的机器上存储20个cookie;
      2、每个cookie的总大小不能超过4096节点;
      3、一台用户机器上的cookie的总数不能超过300个。
      另外,一些新的浏览器还对cookie进行了严格控制,可以让用户阻止所有的cookie、阻止某些未知的网站的cookie或者在创建cookie时进行提示。
     (三) JavaScript中的cookie
      document对象有cookie特性,是包含所有给定页面可访问的cookie的字符串。cookie特性也很特别,因为将这个cookie特性设置为新值只会改变对页面可访问的cookie,并不会真正改变cookie(特性)本身。
      要创建一个cookie,必须按照下面的格式创建字符串:
      cookie_name=cookie_value; expires=expiration_time; path=domain_path; domain=domain_name; secure
      只有字符串的第一部分(指定名称和值的字符串)是对设置cookie必需的,其他部分都是可选的,然后将这个字符串复制给document.cookie特性,即可创建cookie。读取document.cookie的值即可访问这些cookie,以及所有其他可以从给定页面访问的cookie。
      因为创建和读取cookie均需记住它的格式,大部分开发人员用函数用处理这些细节。创建cookie的函数很简单:
      function setCookie(sName,sValue,oExpires,sPath,sDomain,bSecure){
            var sCookie=sName+”=”+encodeURIComponent(sValue);
            if(oExpires){
                  sCookie+=”; expires=”+oExpires.toGMTString();
            }
            if(sPath){
                  sCookie+=”; path=”+sPath;
            }
            if(sDomain){
                  sCookie+=”; domain=”+sDomain;
            }
            if(bSecure){
                  sCookie+=”; secure”;
            }
            document.cookie=sCookie;
      }
      这个函数可以根据传入的参数建立cookie字符串。因为只有前两个参数是必需的。所以函数在把参数传给cookie字符串前,要对参数进行检测,以确保前两个参数是存在的。
      下一个函数getCookie(),通过传入的名称获取cookie的值:
      function getCookie(sName){
            var sRE=”(?:; )?”+sName+”=([^;]*);?”;
            var oRE=new RegExp(sRE);
            if(oRE.test(document.cookie)){
                  return decodeURIComponent(RegExp[“$1”]);
            }else{
                 return null;
          }
      }
      这个函数使用了通过cookie名称建立的正则表达式。由于cookie字符串的格式,正则表达式是从document.cookie中抽取特定值最方便的方法。如果只有一个cookie,字符串就只有一个名称和值,而值就是等于号后面的所有字符,如果后面还有cookie,则用分号进行分隔,也就是说cookie的值包含等于号之后,分号之前的所有字符串。
      最后一个函数deleteCookie(),用于从系统中立即删除一个cookie。将cookie的失效时间设置为过去的一个时间即可实现。
      function deleteCookie(sName,sPath,sDomain){
            setCookie(sName,””,new Date(0),sPath,sDomain);
      }
      有了以上这些函数,就可以很方便的地设置、读取、设置cookie了。 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • WEB前端教程-JavaScript里的类和继承

    WEB前端教程-JavaScript里的类和继承

    2016-01-21 15:28

  • 高性能动画“box-shadow”属性 - FedFun - 博客频道 - CSDN.NET FedFun 爱前端,乐分

    高性能动画“box-shadow”属性 - FedFun - 博客频道 - CSDN.NET FedF

    2015-12-14 16:15

  • JS开发者调查 - FedFun - 博客频道 - CSDN.NET FedFun 爱前端,乐分享,前端痴王海庆的博客!

    JS开发者调查 - FedFun - 博客频道 - CSDN.NET FedFun 爱前端,乐分

    2015-12-13 11:08

  • Jquery下编写流行的前端的应用源码_Javascript教程

    Jquery下编写流行的前端的应用源码_Javascript教程

    2015-10-01 09:24

网友点评
"