(一)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都是以纯文本的形式记录于文件中,因此如果要保存用户名密码等信息时,最好事先经过加密处理。

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

将目录设置为根目录,就可以成为全局变量!

document.cookie="userId=320; path=/";

(二)设置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。

(三)获取cookie的值 
下面介绍如何获取cookie的值。cookie的值可以由document.cookie直接获得:

var strCookie=document.cookie; 
这将获得以分号隔开的多个名/值对所组成的字符串,这些名/值对包括了该域名下的所有cookie。例如:

代码如下:
<script language="JavaScript" type="text/javascript"> 
<!-- 
document.cookie="userId=828"; 
document.cookie="userName=hulk"; 
var strCookie=document.cookie; 
alert(strCookie); 
//--> 
</script> 

从输出可知,只能够一次获取所有的cookie值,而不能指定cookie名称来获得指定的值,这正是处理cookie值最麻 烦的一部分。用户必须自己分析这个字符串,来获取指定的cookie值,例如,要获取userId的值,可以这样实现:

代码如下:
<script language="JavaScript" type="text/javascript"> 
<!-- 
//设置两个cookie 
document.cookie="userId=828"; 
document.cookie="userName=hulk"; 
//获取cookie字符串 
var strCookie=document.cookie; 
//将多cookie切割为多个名/值对 
var arrCookie=strCookie.split("; "); 
var userId; 
//遍历cookie数组,处理每个cookie对 
for(var i=0;i<arrCookie.length;i++){ 
var arr=arrCookie[i].split("="); 
//找到名称为userId的cookie,并返回它的值 
if("userId"==arr[0]){ 
userId=arr[1]; 
break; 


alert(userId); 
//--> 
</script> 

这样就得到了单个cookie的值。

用类似的方法,可以获取一个或多个cookie的值,其主要的技巧仍然是字符串和数组的相关操作。

(四)给cookie设置终止日期 
到现在为止,所有的cookie都是单会话cookie,即浏览器关闭后这些cookie将会丢失,事实上这些cookie仅仅是存储在内存中,而没有建立相应的硬盘文件。

在实际开发中,cookie常常需要长期保存,例如保存用户登录的状态。这可以用下面的选项来实现:

document.cookie="userId=828; expiress=GMT_String"; 
其中GMT_String是以GMT格式表示的时间字符串,这条语句就是将userId这个cookie设置为GMT_String表示的过期时间,超过这个时间,cookie将消失,不可访问。例如:如果要将cookie设置为10天后过期,可以这样实现:

代码如下:

<script language="JavaScript" type="text/javascript"> 
<!-- 
//获取当前时间 
var date=new Date(); 
var expiresDays=10; 
//将date设置为10天以后的时间 
date.setTime(date.getTime()+expiresDays*24*3600*1000); 
//将userId和userName两个cookie设置为10天后过期 
document.cookie="userId=828; userName=hulk; expires="+date.toGMTString(); 
//--> 
</script> 

(五)删除cookie 
为了删除一个cookie,可以将其过期时间设定为一个过去的时间,例如:

代码如下:
<script language="JavaScript" type="text/javascript"> 
<!-- 
//获取当前时间 
var date=new Date(); 
//将date设置为过去的时间 
date.setTime(date.getTime()-10000); 
//将userId这个cookie删除 
document.cookie="userId=828; expires="+date.toGMTString(); 
//--> 
</script> 

cookies如何成为全局变量以及设置,删除,获取的更多相关文章

  1. Cookies设置,获取,删除

    之前的博客,整理了下Session的存储方式和原理http://www.cnblogs.com/chinaagan/p/3200456.html. 本篇再次整理下Cookies的使用和原理. 参考博客 ...

  2. JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;

    JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...

  3. Redis 过期键的设置、获取和删除过期时间

    Redis 过期键的设置.获取和删除过期时间 转自http://blog.51cto.com/littledevil/1813956 设置过期 默认情况下键是没有生存时间的,也就是永不过期,除非清空内 ...

  4. php设置和获取cookie

    php设置和获取cookie setcookie()调用只带有name参数的setcookie(); ()使失效时间为time()或time-; <?php setcookie(); PHP提供 ...

  5. django设置并获取cookie/session,文件上传,ajax接收文件,post/get请求及跨域请求等的方法

    django设置并获取cookie/session,文件上传,ajax接收文件等的方法: views.py文件: from django.shortcuts import render,HttpRes ...

  6. vuex之仓库数据的设置与获取

    如果你之前使用过vue.js,你一定知道在vue中各个组件之间传值的痛苦,在vue中我们可以使用vuex来保存我们需要管理的状态值,值一旦被修改,所有引用该值的地方就会自动更新,那么接下来我们就来学习 ...

  7. js设置、获取单值cookie和多值cookie

    js设置.获取单值cookie和多值cookie,代码如下: var CookieUtil = (function () { var Cookie = function () { // 获取单值coo ...

  8. 设置与获取Cookie

    自己编写的一个Cookie设置与获取函数,大家有什么感觉需要改进的地方,请告知与我,我一定虚心接受. JavaScript - Code: function setCookie(name,value, ...

  9. js设置与获取Cookie

    /*设置与获取Cookie*/ var Cookie ={} Cookie.write = function(key, value, duration){ var d = new Date(); d. ...

随机推荐

  1. EntityFramework Core Raw SQL

    前言 本节我们来讲讲EF Core中的原始查询,目前在项目中对于简单的查询直接通过EF就可以解决,但是涉及到多表查询时为了一步到位就采用了原始查询的方式进行.下面我们一起来看看. EntityFram ...

  2. Java初始化过程

    这篇文章主要讲解Java在创建对象的时候,初始化的顺序.主要从以下几个例子中讲解: 继承关系中初始化顺序 初始化块与构造器的顺序 已经加载过的类的初始化顺序 加载父类,会不会加载子类 创建子类对象会不 ...

  3. ASP.NET MVC5+EF6+EasyUI 后台管理系统(70)-微信公众平台开发-成为开发者

    系列目录 前言: 一.阅读这段系列之前,你必须花半天时间大致阅读微信公众平台的API文档,我尽量以简短快速的语言与大家分享一个过程 二.借助微信公众平台SDK Senparc.Weixin for C ...

  4. 使用Java原生代理实现AOP

    ### 本文由博主柒.原创,转载请注明出处 ### 完整源码下载地址 [https://github.com/MatrixSeven/JavaAOP](https://github.com/Matri ...

  5. Hawk 6. 编译和扩展开发

    Hawk是开源项目,因此任何人都可以为其贡献代码.作者也非常欢迎使用者能够扩展出更有用的插件. 编译 编译需要Visual Stuido,版本建议使用2015, 2010及以上没有经过测试,但应该可以 ...

  6. GOF23设计模式之单例模式

    ·核心作用: -保证一个类只有一个实例,并且提供一个访问该实例的全局访问点. ·常见应用场景: -Windows的Task Manager(任务管理器)就是很典型的单例模式 -Windows的Recy ...

  7. springmvc SSM shiro redis 后台框架 多数据源 代码生成器

    A集成代码生成器 [正反双向(单表.主表.明细表.树形表,开发利器)+快速构建表单 下载地址    ; freemaker模版技术 ,0个代码不用写,生成完整的一个模块,带页面.建表sql脚本,处理类 ...

  8. Tableau未必最佳,国内BI也能突破重围!

    如今,百度一下商业智能或BI工具,总能看到Tableau的身影.并不是Tableau的营销做得好,而是国内对于商业智能工具的认知和选择似乎都落在了Tableau身上.导致不管业内业外都对商业智能的概念 ...

  9. 在MySQL数据库中创建一个完整的表

    1.登陆成功后,首先进入某一个数据库 (不是指数据库服务器) use t1; //t1是数据库名 如图所示: 2.在此数据库中建立数据库表 2.1 先建立表结构(可以理解为表的列名,也就是字段名)在实 ...

  10. java 字节流与字符流的区别

    字节流与和字符流的使用非常相似,两者除了操作代码上的不同之外,是否还有其他的不同呢?实际上字节流在操作时本身不会用到缓冲区(内存),是文件本身直接操作的,而字符流在操作时使用了缓冲区,通过缓冲区再操作 ...