`
lgl669
  • 浏览: 173428 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

javascript操作cookies 以及正确使用cookies的属性

阅读更多

在 JS(JavaScript) 操作cookies比较复杂,在 ASP 里面我们只需要知道 cookie 的名称、cookie 的值就行了,而 JS 里面,我们面对的是 cookie 的字符串,你自己编写这个字符串写入客户端,然后自己解析这个字符串。

  一、从写 cookie 说起。

var the_date = new Date("December 31, 2020");
var expiresDate = the_date.toGMTString();
document.cookie = "userDefineCSS=" + escape(title) + "; expires=" + expiresDate;

  第一句是日期对象;

  第二句将日期格式转换成 GMT 格式;编者者: GMT 即格林威治标准时间,现在也称 UTC 即全球标准时间。

  第三句是将 cookie 内容写入客户端。

  其中 expires 是系统使用的,表示 cookie 的失效日期(也可以省略),expires 不可读。

  escape 是对 cookie 值进行编码,这是为了处理中文、空格等而设立的。

  二、取 cookie 是比较简单的。

function GetCSS()
{
var cookieStr = document.cookie; //取 cookie 字符串,由于 expires 不可读,所以 expires 将不会出现在 cookieStr 中。

if (cookieStr == "")
{
return "main1"; //没有取到 cookie 字符串,返回默认值
}

var cookieValue = cookieStr.split("; "); //将各个 cookie 分隔开,并存为数组,多个 cookie 之间用分号加空隔隔开,不过前面我们只使用了一个 cookie,它的值与 expires 之间也是用分号加空格隔开的
var varName = "userDefineCSS";
var startPos = -1;
var endPos = -1;
for (var i=0; i<cookieValue.length; i++)
{
startPos = cookieValue[i].indexOf(varName);
if (startPos != 0)
{
continue; //当前 cookie 不是名称为 varName 的 cookie,判断下一个 cookie
}
startPos += varName.length + 1; //当前 cookie 就是名称为 varName 的 cookie,由于有等号,所以 +1
endPos = cookieValue[i].length;
var css = unescape(cookieValue[i].substring(startPos, endPos));
return css;
}

return "main1";
}

 

 由于写 cookie 时使用了 escape,所以返回 cookie 值时使用 unescape 进行解码。

  />正确使用cookies的属性

  首先看看cookies的结构

  我们这里所说的 cookie 结构并非其存储结构,而是其表现结构,主要通过研究其表现结构来实现 JS(JavaScript) 对 cookie 的操作。

   cookie 的表现结构较为简单,每个 cookie 由 cookie 名称 和 cookie 值组成,用等号表示二者关系,各个 cookie 之间用分号加空格隔开。正如前面所说 expires、path、domain 均不可读,所以在表现结构中也没有体现出来。

cookieName1=cookieValue1; cookieName2=cookieValue2[...; cookieNamen=cookieValuen]

  通过分隔分号加空格符号,就可以获得各个 cookie,再通过分隔等号,就可以得出各个 cookie 的名称和值。

  cookie 的子键,只是表现在 cookieValue 上,一个子键的结构是:子键名称=子键值,多个子键之间用 & 连接起来。比如:

  cookieName1=子键名称1=子键值1&子键名称2=子键值2

  如果是 ASP 文件,我们会发现 cookie 结构中有这样一段字符串:ASPSESSIONIDQSTDRATQ=24位字符

  关于此,查看:http://www.aspxuexi.com/aspbasic/cookie/2006-6-10/Session_Cookie.htm

  同名的 cookie,不同的 domain 或不同的 path,属不同的 cookie;

  同名的 cookie,相同的 domain 且相同的 path,不同的 expires,属同一个 cookie。

  cookie 有路径--path,表示哪些路径下的文件有权限读取该 cookie。

  path 应该以 "/" 结尾,同名 cookie,不同 path,属不同的 cookie

document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/path";
document.cookie = "N1=3; path=path/";

 

 

如上代码,前两句使用的是绝对路径,即相对于站点根目录的网页目录,第三句使用的是相对路径,相对于当前目录的。

  第一句和第二句在于结尾不同,虽然他们所表达的权限相同,但是由于 path 字符串不同,会形成两个同名的 cookie,容易造成混乱,我们建议不要使用第二句这种格式,因为系统默认也是以 "/" 结尾的。

  所以如上述是三个 cookie,之间不会相互覆盖。

  path 属性值有大小写之分,应与浏览器中的地址栏的输入一致

document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/paTH/";

  这是两个不同的 cookie,因为 path 属性值大小写不同,如果我们在地址栏输入的是 path,那么就读取第一个 N1,如果我们输入的是 paTH,那么就读取第二个 N1

  path 不可读

  同 expires 一样,path 只可写,不可读。

  path 不可更改

  同 expires 不一样,如果我们试图更改 path,那么实际上我们是另外写了一个 cookie,而不是更改了 path 值。

  path 权限有继承性

  假如指定了 /test/ 目录有权限读取某 cookie,那么 /test/ 之下的目录 /test/t/ 也有权限读取该 cookie。

  cookie 有失效日期--expires,如果还没有过失效期,即使重新启动电脑,cookie 仍然不会丢失,如果没有指定 expires 值,那么在关闭浏览器时,cookie 即失效。

  在 JS(JavaScript) 中使用 expires 时应该和 cookie 同时写入,如:

document.cookie = "clr=red; expires=" + expiresDate;

  而如下写法是不正确的:

document.cookie = "clr=red";
document.cookie = "expires=" + expiresDate;

  这样写会形成两个 cookie,第二个 cookie 的名称是 expires,两个 cookie 均没有指定失效日期。

  expires 不可读

  这就是为什么,我们在 ASP 中使用 response.Write request.cookies("cname").expires 会出错,同样在 JS(JavaScript) 中使用 document.cookie 也不会显示出 expires。

  expires 值应该使用 GMT 格式的时间

var the_date = new Date("December 31, 2020");
var expiresDate = the_date.toGMTString(); //转换成 GMT 格式。编者者: GMT 即格林威治标准时间,现在也称 UTC 即全球标准时间。

分享到:
评论

相关推荐

    javascript 操作cookies及正确使用cookies的属性.docx

    ### JavaScript 操作 Cookies 及正确使用 Cookies 的属性 #### 一、Cookies 概述 Cookies 是一种用于在用户浏览器上存储小型数据的技术,通常用于跟踪用户的偏好设置、身份验证状态等。通过 JavaScript,开发者...

    javascript 操作cookies及正确使用cookies的属性

    一、从写 cookie 说起。 var the_date = new Date(“December 31, 2020”); var expiresDate = the_date.toGMTString(); [removed] = “userDefineCSS=” + escape(title) + “;... 其中 expires 是系统使用的,表

    cookiesjs让使用javascript超级简单得操作cookies在前端

    标题"cookiesjs让使用javascript超级简单得操作cookies在前端"和描述"cookies.js - 让使用javascript超级简单得操作cookies在前端"都指向一个名为`cookies.js`的库,这是一个专为前端JavaScript开发设计的库,旨在...

    javascript对cookies的操作

    在探讨“javascript对cookies的操作”这一主题时,我们首先需要理解什么是Cookies以及它们在Web开发中的作用。Cookies是一种小型的数据存储技术,允许Web服务器在用户的浏览器上存储信息,以便于跟踪用户状态、保存...

    javascript 操作cookies详解及实例.docx

    在深入了解如何使用 JavaScript 来操作 Cookies 之前,我们需要先了解 Cookies 的基本概念: - **定义**:Cookies 是一种小型文本文件,服务器可以将其发送到客户端的浏览器,并保存在本地硬盘上,以便服务器能够...

    【JavaScript】cookies详解

    本篇文章将详细讲解JavaScript操作Cookies的方法和应用场景。 一、Cookies的基本原理 Cookies是由服务器端设置,并由客户端(浏览器)存储的小型文本文件。每个Cookie都有一个唯一的名称和值,以及可选的属性,如...

    javascript 使用Cookies经典推荐^_^

    ### JavaScript 使用Cookies经典推荐知识点详解 #### 一、引言 在前端开发中,`Cookies`是一种非常重要的机制,用于存储用户数据以便后续使用。通过`JavaScript`可以方便地读取和设置`Cookies`,这对于实现网站的...

    javascript写的操作cookies的函数汇总

    本文将深入探讨如何使用JavaScript来操作cookies,主要包括创建、读取、更新和删除cookies。 首先,让我们来看看创建一个临时会话cookie的函数。在JavaScript中,不指定过期时间的cookie默认是一个会话cookie,当...

    JavaScript实现cookies设置

    JavaScript实现cookies设置,学习的好参考资料

    ASp Javascript读写Cookies的代码.docx

    除了使用ASP.NET内置的方法外,还可以直接使用JavaScript来实现Cookies的操作。 ##### 写入Cookies ```javascript function SetCookie(name, value) { var Days = 30; var exp = new Date(); exp.setTime(exp....

    C#和javascript操作cookie

    接着,JavaScript在前端操作Cookie主要通过内置的`document.cookie`属性。以下是一些基本操作: 1. **创建Cookie**:设置`document.cookie`的值,格式为`name=value; expires=日期; path=路径; domain=域名; secure...

    cookiejs一个微小的JavaScript库简化了Cookies操作

    Cookie.js是一个轻量级的JavaScript库,专门为简化Web应用程序中的Cookie操作而设计。这个库的目标是提供一个简单、直观的API,使得开发者可以方便地创建、读取、更新和删除Cookies,无需深究浏览器的底层实现。在...

    javascript 操作cookies详解及实例

    本文将详细介绍如何使用JavaScript对cookies进行操作,并给出一些实用的代码实例。 首先,我们来了解JavaScript操作cookies的基本原理。Cookies是存储在用户本地的小文本文件,由Web服务器通过HTTP响应头发送给用户...

    cookies的使用方法

    然后,我们来看如何使用jQuery和cookies.js进行Cookies操作: 1. **添加Cookie**: 使用`$.cookie()`方法可以创建新的Cookie。例如,我们要创建一个名为"user_name"的Cookie,并赋予值"John",有效期为7天: ```...

    前端cookies安全视频

    前端Cookies主要指存储在用户浏览器上的,由JavaScript操作的Cookies。 二、Cookies的工作原理 当用户访问一个网站时,服务器可以发送一个包含Cookie信息的HTTP响应头。浏览器接收到这个信息后,会在本地存储。当...

    javascript结合Cookies实现浏览记录历史.docx

    ### JavaScript 结合 Cookies 实现浏览记录历史 #### 一、背景与需求分析 在现代Web应用中,用户体验是至关重要的因素之一。为了提供更加个性化的服务,很多网站都会记录用户的浏览历史,以此来推荐相关内容或优化...

    javascript结合Cookies实现浏览记录历史第2 3页.docx

    本文档主要介绍如何使用JavaScript和Cookies技术来实现这一功能。具体需求为: - 记录用户在网站上的点击历史。 - 将这些历史记录按照时间降序排列,并且只展示最新的六条记录,同时确保记录不重复。 #### Cookies...

    javascript结合Cookies实现浏览记录历史第1 3页.docx

    ### JavaScript结合Cookies实现浏览记录历史 #### 背景与需求 在现代Web开发中,为用户提供个性化的体验是至关重要的。其中一种常见的个性化功能就是记录用户的浏览历史,以便能够根据用户的行为提供更加精准的服务...

Global site tag (gtag.js) - Google Analytics