`
fastwind
  • 浏览: 319309 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

精通js操作cookie|js操作

阅读更多

先来看下一个操作cookie的函数

如果还不懂,就请看下面的详细说明

 

/**//*
名称:Cookie函数
版本:1.0.1 (Beta)
作者:包进

E-mail:baojingreat@163.com
*/
var HL = HL || ...{};
HL.Cookie = ...{
/**//*
函数名称:HL.Cookie.Get([string name])
函数功能:得到Cookie
参数:name 可选项,要取得的Cookie名称
说明:name为空时将通过数组形式返回全部Cookie,name不为空时返回此Cookie名称的值,没有任何值时返回undefined
*/
 Get : function(name)...{
  var cv = document.cookie.split("; ");//使用"; "分割Cookie
  var cva = [], temp;
  /**//*循环的得到Cookie名称与值*/
  for(i=0; i<cv.length; i++)...{
  temp = cv[i].split("=");//用"="分割Cookie的名称与值
  cva[temp[0]] = unescape(temp[1]);
  }
  if(name) return cva[name];//如果有name则输出这个name的Cookie值
  else return cva;//如果没有name则输出以名称为key,值为Value的数组
 },
/**//*
函数名称:HL.Cookie.Set(string name, string value[, int expires[, string path[, string domain[, string secure]]]])
函数功能:存入Cookie
参数:name 必要项,要存入的Cookie名称
  value 必要项,要存入的Cookie名称对应的值
  expires 可选项,Cookie的过期时间,可以填入以秒为单位的保存时间,也可以填入日期格式(wdy, DD-Mon-YYYY HH:MM:SS GMT)的到期时间
  path 可选项,Cookie在服务器端的有效路径
  domain 可选项,该Cookie的有效域名
  secure 可选项, 指明Cookie 是否仅通过安全的 HTTPS 连接传送,0或false或空时为假
说明:保存成功则返回true,保存失败返回false
*/
 Set : function(name, value, expires, path, domain, secure)...{
  if(!name || !value) return false;//如果没有name和value则返回false
  if(name == "" || value == "") return false;//如果name和value为空则返回false
  /**//*对于过期时间的处理*/
  if(expires)...{
  /**//*如果是数字则换算成GMT时间,当前时间加上以秒为单位的expires*/
  if(/^[0-9]+$/.test(expires))...{
  var today = new Date();
  expires = new Date(today.getTime()+expires*1000).toGMTString();
  /**//*判断expires格式是否正确,不正确则赋值为undefined*/
  }else if(!/^wed, d...{2} w...{3} d...{4} d...{2}:d...{2}:d...{2} GMT$/.test(expires))...{
  expires = undefined;
  }
  }
  /**//*合并cookie的相关值*/
  var cv = name+"="+escape(value)+";"
  + ((expires) ? " expires="+expires+";" : "")
  + ((path) ? "path="+path+";" : "")
  + ((domain) ? "domain="+domain+";" : "")
  + ((secure && secure != 0) ? "secure" : "");
  /**//*判断Cookie总长度是否大于4K*/
  if(cv.length < 4096)...{
  document.cookie = cv;//写入cookie
  return true;
  }else...{
  return false;
  }
 },
/**//*
函数名称:HL.Cookie.Del(string name[, string path[, string domain]])
函数功能:删除Cookie
参数:name 必要项,要删除的Cookie名称
  path 可选项,要删除的Cookie在服务器端的有效路径
  domain 可选项,要删除的Cookie的有效域名
说明:删除成功返回true,删除失败返回false
*/
 Del : function(name, path, domain)...{
  if(!name) return false;//如果没有name则返回false
  if(name == "") return false;//如果name为空则返回false
  if(!this.Get(name)) return false;//如果要删除的name值不存在则返回false
  /**//*合并Cookie的相关值*/
  document.cookie = name+"=;"
  + ((path) ? "path="+path+";" : "")
  + ((domain) ? "domain="+domain+";" : "")
  + "expires=Thu, 01-Jan-1970 00:00:01 GMT;";
  return true;
 }
} 
 


 

开始讲解精通cookie之路

。。。。。

 

<!—Cookies,有些人喜欢它们,有些人憎恨它们。但是,很少有人真正知道如何使用它们。现在你可以成为少数人中的成员-可以自傲的Cookie 大师。-->

如果你象作者一样记性不好,那么你可能根本记不住人们的名字。我遇到人时,多半只是点点头,问句“吃了嘛!”,而且期望问候到此为止。如果还需要表示些什么,那么我就得求助于一些狡猾的技巧,好让我能想对方是谁。比如胡扯起一些和对方有关的人,不管他们之间关系多远,只要能避免不记得对方名字的尴尬就好: “你隔壁邻居的侄子的可爱小狗迈菲斯特怎么样?”通过这个方法,我希望能让对方感到,我确实很重视他(她),甚至还记得这些琐事,虽然实际上连名字都忘记了。但是,不是我不重视,而是我的记忆力实在是糟糕,而且要记住的名字又实在太多。如果我能给每个人设置cookies,那么我就不会再犯这种记忆力问题了。

在这篇文章里,我们要学习:

1. 什么是 Cookies?
2. Cookie 的构成
3. 操纵 Cookies
4. Cookie 怪兽

什么是Cookies?

你会问,什么是cookies呢? cookie 是浏览器保存在用户计算机上的少量数据。它与特定的WEB页或WEB站点关联起来,自动地在WEB浏览器和WEB服务器之间传递。

比如,如果你运行的是Windows操作系统,使用Internet Explorer上网,那么你会发现在你的“Windows”目录下面有一个子目录,叫做“Temporary Internet Files”。如果你有空看看这个目录,就会发现里面有一些文件,文件名称看起来就象电子邮件地址。比如在我机器上的这个目录里,就有 “jim@support.microsoft.com”这样的文件。这是一个cookie 文件,这个文件从哪来呢?猜一猜,它来自微软的支持站点。顺便说一句,这不是我的电子邮件地址,特此澄清。

对于管理细小的、不重要的、不想保存在中央数据库里的细节信息,Cookies 是个很不错的方案。(这不是说大家的名字不重要。)比如,目前网站上不断增长的自定义服务,可以为每个用户定制他们要看的内容。如果你设计的就是这样一个站点,那么你怎么来管理这样的信息:一个用户喜欢绿色的菜单条,而另一个喜欢红色的。确实是个累人的问题。不过,这样的信息,可以很安全地记录到cookie,并保存在用户的计算机上,而你自己的数据库空间可以留给更长久更有意义的数据。

FYI: Cookies 对于安全用途,通常很有用。我不想在此就这一问题过于深入,只是提供一个示例,可以看到如何使用在一段时间之后过期的cookies来保证站点安全:

1. 使用用户名和口令,通过 SSL 登录。
2. 在服务器的数据库里检查用户名和口令。如果登录成功,建立一个当前时间标签的消息摘要 (比如 MD5) ,并把它保存在cookie和服务器数据库里。把用户的登录时间保存在服务器数据库里面的用户记录里。
3. 在进行每个安全事务时(用户处于登录状态的任何事务),把cookie的消息摘要和保存在服务器数据库里的摘要进行比较,如果比较失败,就把用户引导到登录界面。
4. 如果第3步检查通过,那么检查当前时间和登录时间之音经过的时间是否超过允许的时间长度。如果用户已经超时,那么就把用户引到登录界面。
5. 如果第3步和第4步都通过了,那么把登录时间重新设置成当前时间,允许事务发生。那些需要你登录的安全站点,可能多数使用的都是和这里介绍的类似的方法。
Cookie的构成

Cookies最初设计时,是为了CGI编程。但是,我们也可以使用Javascript脚本来操纵cookies。在本文里,我们将演示如何使用Javascript脚本来操纵cookies。(如果有需求,我可能会在以后的文章里介绍如何使用Perl进行cookie管理。但是如果实在等不得,那么我现在就教你一手:仔细看看CGI.pm。在这个CGI包里有一个cookie()函数,可以用它建立cookie。但是,还是让我们先来介绍cookies的本质。

在Javascript脚本里,一个cookie 实际就是一个字符串属性。当你读取cookie的值时,就得到一个字符串,里面当前WEB页使用的所有cookies的名称和值。每个cookie除了name名称和value值这两个属性以外,还有四个属性。这些属性是: expires过期时间、 path路径、 domain域、以及 secure安全。

Expires – 过期时间。指定cookie的生命期。具体是值是过期日期。如果想让cookie的存在期限超过当前浏览器会话时间,就必须使用这个属性。当过了到期日期时,浏览器就可以删除cookie文件,没有任何影响。

Path – 路径。指定与cookie关联的WEB页。值可以是一个目录,或者是一个路径。如果http://www.zdnet.com/devhead/index.html 建立了一个cookie,那么在http://www.zdnet.com/devhead/目录里的所有页面,以及该目录下面任何子目录里的页面都可以访问这个cookie。这就是说,在http://www.zdnet.com/devhead/stories/articles 里的任何页面都可以访问http://www.zdnet.com/devhead/index.html建立的cookie。但是,如果http://www.zdnet.com/zdnn/ 需要访问http://www.zdnet.com/devhead/index.html设置的cookes,该怎么办?这时,我们要把cookies 的path属性设置成“/”。在指定路径的时候,凡是来自同一服务器,URL里有相同路径的所有WEB页面都可以共享cookies。现在看另一个例子:如果想让 http://www.zdnet.com/devhead/filters/ 和http://www.zdnet.com/devhead/stories/共享cookies,就要把path设成“/devhead”。

Domain – 域。指定关联的WEB服务器或域。值是域名,比如zdnet.com。这是对path路径属性的一个延伸。如果我们想让 catalog.mycompany.com 能够访问shoppingcart.mycompany.com设置的cookies,该怎么办? 我们可以把domain属性设置成“mycompany.com”,并把path属性设置成“/”。FYI:不能把cookies域属性设置成与设置它的服务器的所在域不同的值。

Secure – 安全。指定cookie的值通过网络如何在用户和WEB服务器之间传递。这个属性的值或者是“secure”,或者为空。缺省情况下,该属性为空,也就是使用不安全的HTTP连接传递数据。如果一个 cookie 标记为secure,那么,它与WEB服务器之间就通过HTTPS或者其它安全协议传递数据。不过,设置了secure属性不代表其他人不能看到你机器本地保存的cookie。换句话说,把cookie设置为secure,只保证cookie与WEB服务器之间的数据传输过程加密,而保存在本地的cookie文件并不加密。如果想让本地cookie也加密,得自己加密数据。

操纵Cookies

请记住,cookie就是文档的一个字符串属性。要保存cookie,只要建立一个字符串,格式是name=<value>(名称=值),然后把文档的 document.cookie 设置成与它相等即可。比如,假设想保存表单接收到的用户名,那么代码看起来就象这样:

document.cookie = "username" + escape(form.username.value);

在这里,使用 escape() 函数非常重要,因为cookie值里可能包含分号、逗号或者空格。这就是说,在读取cookie值时,必须使用对应的unescape()函数给值解码。

我们当然还得介绍cookie的四个属性。这些属性用下面的格式加到字符串值后面:

name=<value>[; expires=<date>][; domain=<domain>][; path=<path>][; secure]

名称=<值>[; expires=<日期>][; domain=<域>][; path=<路径>][; 安全]

<value>, <date>, <domain> 和 <path> 应当用对应的值替换。<date> 应当使用GMT格式,可以使用Javascript脚本语言的日期类Date的.toGMTString() 方法得到这一GMT格式的日期值。方括号代表这项是可选的。比如在 [; secure]两边的方括号代表要想把cookie设置成安全的,就需要把"; secure" 加到cookie字符串值的后面。如果"; secure" 没有加到cookie字符串后面,那么这个cookie就是不安全的。不要把尖括号<> 和方括号[] 加到cookie里(除非它们是某些值的内容)。设置属性时,不限属性,可以用任何顺序设置。

下面是一个例子,在这个例子里,cookie "username" 被设置成在15分钟之后过期,可以被服务器上的所有目录访问,可以被"mydomain.com"域里的所有服务器访问,安全状态为安全。

// Date() 的构造器设置以毫秒为单位
// .getTime() 方法返回时间,单位为毫秒
// 所以要设置15分钟到期,要用60000毫秒乘15分钟
var expiration = new Date((new Date()).getTime() + 15 * 60000);
document.cookie = "username=" + escape(form.username.value)+ "; expires ="
+ expiration.toGMTString() + "; path=" + "/" + "; _
domain=" + "mydomain.com" + "; secure";

读取cookies值有点象个小把戏,因为你一次就得到了属于当前文档的所有cookies。

// 下面这个语句读取了属于当前文档的所有cookies
var allcookies = document.cookie;

现在,我们得解析allcookies变量里的不同cookies,找到感兴趣的指定cookie。这个工作很简单,因为我们可以利用Javascript语言提供的扩展字符串支持。

如果我们对前面分配的cookie "username" 感兴趣,可以用下面的脚本来读取它的值。

// 我们定义一个函数,用来读取特定的cookie值。
function getCookie(cookie_name)
{
var allcookies = document.cookie;
var cookie_pos = allcookies.indexOf(cookie_name);

// 如果找到了索引,就代表cookie存在,
// 反之,就说明不存在。
if (cookie_pos != -1)
{
// 把cookie_pos放在值的开始,只要给值加1即可。
cookie_pos += cookie_name.length + 1;
var cookie_end = allcookies.indexOf(";", cookie_pos);

if (cookie_end == -1)
{
cookie_end = allcookies.length;
}

var value = unescape(allcookies.substring(cookie_pos, cookie_end));
}

return value;
}

// 调用函数
var cookie_val = getCookie("username");

上面例程里的 cookie_val 变量可以用来生成动态内容,或者发送给服务器端CGI脚本进行处理。现在你知道了使用Javascript脚本操纵cookies的基本方法。但是,如果你跟我一样,那么我们要做的第一件事,就是建立一些接口函数,把cookies处理上的麻烦隐藏起来。不过,在你开始编程之前,稍候片刻。这些工作,早就有人替你做好了。你要做的,只是到哪去找这些接口函数而已。

比如,在David Flangan的Javascript: The Definitive Guide 3rd Ed.这本书里,可以找到很好的cookie应用类。你也可以在Oreilly的WEB站点上找到这本书里的例子。本文最后的链接列表里,有一些访问这些cookie示例的直接链接。

Cookies 怪兽

因为某些原因Cookies 的名声很不好。许多人利用cookies做一些卑鄙的事情,比如流量分析、点击跟踪。Cookies 也不是非常安全,特别是没有secure属性的cookies。不过,即使你用了安全的cookies,如果你和别人共用计算机,比如在网吧,那么别人就可以窥探计算机硬盘上未加密保存的cookie文件,也就有可能窃取你的敏感信息。所以,如果你是一个WEB开发人员,那么你要认真考虑这些问题。不要滥用cookies。不要把用户可能认为是敏感的数据保存在cookies里。如果把用户的社会保险号、信用卡号等保存在cookie里,等于把这些敏感信息放在窗户纸下,无异于把用户投到极大危险之中。一个好的原则是,如果你不想陌生人了解你的这些信息,那就不要把它们保存在cookies里。

另外,cookies还有一些实际的限制。Cookies保留在计算机上,不跟着用户走。如果用户想换计算机,那么新计算机无法得到原来的cookie。甚至用户在同一台计算机上使用不同浏览器,也得不到原来的cookie:Netscape 不能读取Internet Explorer 的cookies。

还有,用户也不愿意接受cookies。所以不要以为所有的浏览器都能接受你发出的cookies。如果浏览器不接受cookies,你要保证自己的WEB站点不致因此而崩溃或中断。

另外WEB 浏览器能保留的cookies不一定能超过300个。也没有标准规定浏览器什么时候、怎么样作废cookies。所以达到限制时,浏览器能够有效地随机删除cookies。浏览器保留的来自一个WEB服务器上的cookies,不超过20个,每个cookie的数据(包括名称和值),不超过4K字节。(不过,本文里的cookie尺寸没问题,它只占了12 K字节,保存在3个3 cookies里。)

简而言之,注意保持cookie简单。不要依赖cookies的存在,不要在每个cookie里保存太多信息。不要保存太多的cookes。但是,抛除这些限制,在技巧高超的WEB管理员手里,cookie的概念是一个有用的工具

分享到:
评论

相关推荐

    javascript从入门到精通PPT

    《JavaScript从入门到精通》附带的ppt 《JavaScript从入门到精通》从初学者角度出发,通过通俗易懂的语言、丰富多彩的实例,详细介绍了使用JavaScript语言进行程序开发应该掌握的各方面技术。全书共分24章,包括初识...

    精通javascript

    • 1.3.js 1.3.htm使用的外部JavaScript文件 第2章(\第2章) • 2.1.htm Infinity应用 • 2.2.htm NaN与isNaN()的用法 • 2.3.htm Infinity值的用法 • 2.4.htm 转义字符的使用 ...

    精通JavaScript

    • 1.3.js 1.3.htm使用的外部JavaScript文件 第2章(\第2章) • 2.1.htm Infinity应用 • 2.2.htm NaN与isNaN()的用法 • 2.3.htm Infinity值的用法 • 2.4.htm 转义字符的使用 ...

    非常不错的[JS]Cookie精通之路第1/2页

    Cookies,有些人喜欢它们,有些人憎恨它们。但是,很少有人真正知道如何使用它们。现在你可以成为少数人中的成员-可以自傲的Cookie 大师。

    PHP从入门到精通

    、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与 Session、图形图像处理技术、文件系统、面向对象、PHP加密技术、MySQL数据 库基础、phpMyAdmin图形化管理工具、PHP操作MySQL数据库、...

    JavaScript入门经典(第3版)高清PDF—5

    在《JavaScript入门经典(第3版)》的高级主题中,将介绍如何使用cookie,以及如何应用DHTML技术使Web页面焕发动感和活力。另外,《JavaScript入门经典(第3版)》还介绍了Ajax 技术。Ajax技术允许在客户端代码中使用...

    PHP从入门到精通.pdf-入门教程.CHM

    全书共分27章,包括初识.PHP、PHP环境搭建和开发工具、PHP语言基础、流程控制语句、字符串操作、正则表达式、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与Session、图形图像处理技术、...

    PHP从入门到精通.pdf

    全书共分27章,包括初识.PHP、PHP环境搭建和开发工具、PHP语言基础、流程控制语句、字符串操作、正则表达式、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与Session、图形图像处理技术、...

    PHP从入门到精通PPT

    全书共分4篇25章,包括初识PHP、PHP环境搭建和开发工具、PHP语言基础、流程控制语句、字符串操作、正则表达式、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与Session、图形图像处理技术、...

    PHP从入门到精通(第2版)(潘凯华).(扫描版)

    全书共分24章,包括初识PHP、PHP环境搭建和开发工具、PHP语言基础、流程控制语句、字符串操作、正则表达式、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与Session、图形图像处理技术、文件...

    PHP 从入门到精通

    全书共分27章,包括初识.PHP、PHP环境搭建和开发工具、PHP语言基础、流程控制语句、字符串操作、正则表达式、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与Session、图形图像处理技术、...

    PHP从入门到精通第二版

    全书共分24章,包括初识PHP、PHP环境搭建和开发工具、PHP语言基础、流程控制语句、字符串操作、正则表达式、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与Session、图形图像处理技术、文件...

    PHP从入门到精通 源码

    全书共分24章,包括初识PHP、PHP环境搭建和开发工具、PHP语言基础、流程控制语句、字符串操作、正则表达式、PHP数组、PHP与Web页面交互、PHP与JavaScript交互、日期和时间、Cookie与Session、图形图像处理技术、文件...

    JavaScript权威指南(第6版)中文文字版

    本书适合那些希望学习WEB编程语言的初、中级程序员和希望精通JavaScript的程序员阅读。 作者简介 作者:(美国)弗兰纳根(David Flanagan) 译者:淘宝前端团队 弗兰纳根(David Flanagan)是一名程序员,也是一名...

    PHP7从入门到精通.zip

    分别介绍了PHP 7的基本概念、PHP服务器环境配置、PHP的基本语法、PHP的语言...Cookie和会话管理、MySQL数据库基础、PHP操作MySQL数据库、PDO数据库抽象类库、JavaScript编程基础、PHP与XML技术、PHP与Ajax的综合应用、...

    PHP入门到精通

    字符串操作(教学录像:1小时18分13秒) 5.1字符串简介 5.2单引号和双引号的区别 5.3字符串的连接符 5.4字符串操作 正则表达式(教学录像:28分34秒) 6.1什么是正则表达式 6.2正则表达式语法规则 6.3POSIX扩展正则...

    PHP入门到精通02

    字符串操作(教学录像:1小时18分13秒) 5.1字符串简介 5.2单引号和双引号的区别 5.3字符串的连接符 5.4字符串操作 正则表达式(教学录像:28分34秒) 6.1什么是正则表达式 6.2正则表达式语法规则 6.3POSIX扩展正则...

    36个JS特效教程,学完即精通.zip

    目录;网盘文件永久链接 01简版计算器(版),mp4 ...03正则表达式的编写思路(js版),m 04通过 Cookie用户自定义模板(bo 05网页的弹窗广告位(bom版),mp4 06DoM动画在区域内的弹球(dom ...................

Global site tag (gtag.js) - Google Analytics