zoukankan      html  css  js  c++  java
  • js中的cookie

    1. 设置cookie
      1.1 每个cookie都是一个名/值对,可以把下面这样一个字符串赋值给document.cookie: 

    1 document.cookie="user_Id=828";

      1.2 如果要一次存储多个名/值对,可以使用分号加空格(; )隔开,例如: 

    1 document.cookie="user_Id=828; user_Name=hulk";

      1.3 cookie的名或值中不能使用分号(;)、逗号(,)、等号(=)以及空格。在cookie的名中做到这点很容易,但要保存的值是不确定的。如何来存储这些值呢?

        方法是用escape()函数进行编码,它能将一些特殊符号使用十六进制表示,例如空格将会编码为“20%”,从而可以存储于cookie值中,而且使用此种方案还可以避免中文乱码的出现。例如:  

    1 document.cookie="str="+escape("I love you"); 
    2 //等价于:
    3 document.cookie="str=I%20love%20you";

        当使用escape()编码后,在取出值以后需要使用unescape()进行解码才能得到原来的cookie值,如果没有空格和汉字应该可以直接显示正确的值,具体遇到再试试吧。

      1.4 Cookies就像一个大盒子,里面又有好多小盒子,如下例子,document.cookie相当于找到大盒子,name相当于将一个小盒子起个名字,name=value相当于将value放到名为name的小盒子中,可以同时存在多个名字不同的小盒子,如下写法可以存多个值:

    1 document.cookie="name=value";
    2 document.cookie="name1=value1";
    3 document.cookie="name2=value2";
    4 ...

       1.5 如果要改变一个cookie的值,只需重新赋值,如下代码这样获取到的Cookies值为"222",而不是"111"(获取问题后面说)。:

    1 document.cookie="user_Id=111";
    2 document.cookie="user_Id=222";

    2. 获取cookie的值

      2.1 cookie的值可以由document.cookie直接获得,写法如下代码所示,但是这将获得以分号隔开的多个键/值对所组成的字符串,这些键/值对包括了该域名下的所有cookie,

    1 var strCookie=document.cookie;//获取该域名下所有Cookies
    2 alert(strCookie);//弹窗显示

       2.2 如方法上方法中,虽然能获取到的Cookie,但是用户必须自己分析这个字符串,来获取指定的cookie值,比较麻烦,这时有第二种方法,在最后有说明,也给出了代码,简单说就是设置个方法,直接调用,急用的朋友可以直接到最后看。

     3. 给cookie设置终止日期  

      不设置终止时间的Cookies都属于单会话cookie,即浏览器关闭后这些cookie将会被清除,因为会话cookie是存在内存中的。

      在实际开发中,cookie常常需要长期保存,例如保存用户登录的状态,记住密码,页面设置等信息。这可以用下面的选项来实现: 

    1 document.cookie="user_Id=111; expires=GMT_String";

      其中GMT_String是以GMT格式表示的时间字符串,这条语句就是将userId这个cookie设置为GMT_String表示的过期时间,超过这个时间,cookie将会被自动删除,访问不到。例如:

      如果要将cookie设置为10天后过期,可以这样实现:

    复制代码
     1 <script language="JavaScript" type="text/javascript">
     2 
     3 //获取当前时间
     4 
     5 var date=new Date();
     6 
     7 var expireDays=10; //将date设置为10天以后的时间
     8 
     9 date.setTime(date.getTime()+expireDays*24*3600*1000);
    10 /*将userId和userName两个cookie设置为10天后过期*/
    11 
    12 document.cookie="user_Id=111;user_Name=escape(xiongda);expire="+date.toGMTString(); 
    13 
    14 </script>
    复制代码

    4. 删除cookie
      cookies没有直接删除的语句(我没找到,哪位大神知道求告知...),为了达到删除指定cookie的方法,可以将其过期时间设定为一个过去的时间,例如:

    复制代码
    1 <script language="JavaScript" type="text/javascript"> 
    2 //获取当前时间
    3 var date=new Date();
    4 //将date设置为过去的时间
    5 date.setTime(date.getTime()-1000);
    6 //将user_Id这个cookie删除
    7 document.cookie="user_Id=111; expire="+date.toGMTString();
    8 </script>
    复制代码

    5. 指定可访问cookie的路径

        默认情况下,如果在某个页面创建了一个cookie,那么该页面所在目录中的其他页面也可以访问该cookie。如果这个目录下还有子目录,则在子目录中也可以访问。

      例如在 www.xxxx.com/total/main.jsp 中所创建的cookie,可以被 www.xxxx.com/total 或 www.xxxx.com/total/some/c.jsp所访问,但不能被www.xxxx.com/d.html访问。

      为了控制cookie可以访问的目录,需要使用path参数设置cookie,语法如下: 

    1 document.cookie="name=value; path=/total";

      其中total表示可访问cookie的目录。例如: 

    1 document.cookie="user_Id=111; path=/page";

           表示当前cookie仅能在page目录下使用。

      如果要使cookie在整个网站下可用,可以将cookie的path指定为根目录,例如: 

    1 document.cookie="userId=111; path=/";

    6. 指定可访问cookie的主机名(这部分没有亲自实践,一般不这样用)

      和路径类似,主机名是指同一个域下的不同主机,例如:www.baidu.com和www.google.com就是两个不同的主机名。默认情况下,一个主机中创建的cookie在另一个主机下是不能被访问的,但可以通过domain参数来实现对其的控制,其语法格式为:

    document.cookie="name=value;
    
    domain=cookieDomain";

     以google为例,要实现跨主机访问,可以写为:

    1 document.cookie="name=value;
    2 domain=.google.com";

     这样,所有google.com下的主机都可以访问该cookie。

    参考网上的例子,以及自己实践所得,写了一个获取和存储cookie的js方法,使用还是挺方便的,cookie是真的好用,由于js使用session比较麻烦,写页面还是cookie实用

    主要参考这位道友的文章,修改了一些表述方式,挂上链接,大家可以做对比参考,链接:http://www.cnblogs.com/Jackie-sky/p/3672544.html

    综合示例:cookie设置较为复杂,但是使用频率高,并具有一定的相似性。因此可以定义几个函数来完成cookie的通用操作,从而实现代码的复用。下面列出了常用的cookie操作及其函数实现,需要的朋友可以复制走,放到自己的项目就好了。

    复制代码
     1 /*创建cookie 无属性*/
     2 function SetCookie(name,value){//键/值
     3 //默认传值,不设置任何变量
     4   document.cookie=name+"="+escape(value);
     5 }
     6 /*创建cookie 设置访问路径*/
     7 function SetCookiePath(name,value){//键/值
     8 //将cookie设置为根目录下的所有页面可以访问,具体项目可以自己更改
     9   document.cookie=name+"="+escape(value)+";path=/";
    10 }
    11 
    12 /*创建cookie 设置失效时间*/
    13 function SetCookieTime(name,value,expireHours){//键/值/时间(天)
    14   var cookieString=name+"="+escape(value);
    15   var date=new Date();
    16    date.setTime(date.getTime+expireHours*24*60*60*1000);
    17    cookieString=cookieString+";expire="+date.toGMTString();
    18    document.cookie=cookieString;
    19 }
    20 
    21 /*创建cookie 同时设置访问路径和失效时间*/
    22 function SetCookieTimePath(name,value,expireHours){//键/值/时间(天)
    23 //将cookie设置为根目录下的所有页面可以访问,并且有时间限制,具体项目可以自己更改
    24    var cookieString=name+"="+escape(value);
    25    var date=new Date();
    26    date.setTime(date.getTime+expireHours*24*60*60*1000);
    27    cookieString=cookieString+";expire="+date.toGMTString();
    28    cookieString=cookieString+";path=/"//具体项目可更改path值
    29    document.cookie=cookieString;
    30 }
    31 /*根据cookie的键查询cookie*/
    32 function GetCookie(name){//要查询的键
    33   var arr,reg=new RegExp("(^|)"+name+"=([^;]*)(;|$)");
    34   if(arr=document.cookie.match(reg))
    35       return unescape(arr[2]);
    36   else
    37       return null;
    38 }
    39 
    40 /*根据cookie的键删除cookie*/
    41 function DeleteCookie(name){//要删除的键名
    42   var date=new Date();
    43   date.setTime(date.getTime()-10000);
    44    document.cookie=name+"=v; expire="+date.toGMTString();
    45 }        
    复制代码
  • 相关阅读:
    day01--计算机硬件基础笔记
    22 Jun 18 Django,ORM
    21 Jun 18 Django,ORM
    20 Jun 18 复习, mysql
    20 Jun 18 Django,ORM
    19 Jun 18 复习, 正则表达式
    19 Jun 18 Django
    15 Jun 18 复习, shutil模块
    15 Jun 18 Django
    14 Jun 18 复习, form表单
  • 原文地址:https://www.cnblogs.com/zouhong/p/11821549.html
Copyright © 2011-2022 走看看