当前位置：首页 > 前端技术 > javascript >内容正文

javascript

把数据保存到cook_JavaScript数据存储 Cookie篇

发布时间：2024/9/3 javascript 49 豆豆

生活随笔收集整理的这篇文章主要介绍了把数据保存到cook_JavaScript数据存储 Cookie篇小编觉得挺不错的,现在分享给大家,帮大家做个参考.

1.什么是cookie？

答：cookie是用于在客户端存储会话信息的。

2.cookie的组成部分？ ①名称：一个唯一确定cookie 的名称。建议区分大小写。cookie 的名称必须是经过URL 编码的。

②值：储存在cookie 中的字符串值。值必须被URL 编码。

③域：cookie 对于哪个域是有效的。所有向该域发送的请求中都会包含这个cookie 信息。这个值可以包含子域(subdomain，如www.wrox.com)，也可以不包含它(如.wrox.com，则对于wrox.com的所有子域都有效)。如果没有明确设定，那么这个域会被认作来自设置cookie 的那个域。

④路径：对于指定域中的那个路径，应该向服务器发送cookie。例如，你可以指定cookie 只有从http://www.wrox.com/books/ 中才能访问，那么http://www.wrox.com 的页面就不会发送cookie 信息，即使请求都是来自同一个域的。

⑤失效时间：表示cookie 何时应该被删除的时间戳。默认情况下，浏览器会话结束时即将所有cookie 删除；不过也可以自己设置删除时间。这个值是个GMT 格式的日期(Wdy, DD-Mon-YYYY HH:MM:SS GMT)，用于指定应该删除cookie 的准确时间。因此，cookie

可在浏览器关闭后依然保存在用户的机器上。如果你设置的失效日期是个以前的时间，则cookie 会被立刻删除。

⑥安全标志：指定后，cookie 只有在使用SSL 连接的时候才发送到服务器。例如，cookie 信息只能发送给https://www.wrox.com，而http://www.wrox.com 的请求则不能发送cookie。

3.列举一个cookie的例子？以下是一个完整的cookie的例子，我们将把它分解开来：

Set-Cookie: name=value; expires=Mon, 22-Jan-07 07:10:24 GMT; domain=.wrox.com; path=/; secure

①名称: name字符串表示

②值：value字符串表示

③过期时间：Mon, 22-Jan-07 07:10:24 GMT

④域名：.wrox.com

⑤路径：当前目录/

⑥安全标志：secure

4.如何操作cookie？

var CookieUtil = {

// 设置cookie

set : function (name, value, expires, domain, path, secure) {

var cookieText = "";

cookieText += encodeURIComponent(name) + "=" + encodeURIComponent(value);

if (expires instanceof Date) {

cookieText += "; expires=" + expires.toGMTString();

}

if (path) {

cookieText += "; path=" + path;

}

if (domain) {

cookieText += "; domain=" + domain;

}

if (secure) {

cookieText += "; secure";

}

document.cookie = cookieText;

// name=value; expires=expiration_time; path=domain_path; domain=domain_name; secure

// 获取cookie

get : function (name) {

var cookieName = encodeURIComponent(name) + "=",

cookieStart = document.cookie.indexOf(cookieName),

cookieValue = "";

if (cookieStart > -1) {

var cookieEnd = document.cookie.indexOf (";", cookieStart);

if (cookieEnd == -1) {

cookieEnd = document.cookie.length;

}

cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd));

}

return cookieValue;

// 删除cookie

unset : function (name, domain, path, secure) {

this.set(name, "", Date(0), domain, path, secure);

}

};

// 测试

CookieUtil.set("name", "zhang");

var name = CookieUtil.get("name");

alert(name); // zhang

CookieUtil.unset("name");

alert(CookieUtil.get("name")); // 空

5.cookie的限制

①存储数据数量有限

②保了储存在cookie 中的信息只能让批准的接受者访问，而无法被其他域访问

③安全性有限

6.针对cookie数据存储少量的问题，我们提出了子cookie的概念。即在每条cookie的值中存储多条数据，用"&"隔开。

var SubCookieUtil = {

/** 设置一条完整的cookie

* param name : 表示cookie的名称，必填

* param subCookies : 表示cookie的值，为一个对象，必填

* param expires : 表示cookie的过期时间，可以不填

* param domain : 表示cookie的域名，可以不填

* param path : 表示cookie的路径，可以不填

* param secure : 表示cookie的安全标志，可以不填

* eg : SubCookieUtil.setAll("info", { name : "zhang", age : 23});

**/

setAll : function (name, subCookies, expires, domain, path, secure) {

var cookieText = "", subName, cookieParts = [];

cookieText += encodeURIComponent(name) + "=";

for(subName in subCookies) {

cookieParts.push(encodeURIComponent(subName) + "=" + encodeURIComponent(subCookies[subName]));

}

if (cookieParts.length > 0) {

cookieText += cookieParts.join("&");

if (expires instanceof Date) {

cookieText += "; expires=" + expires.toGMTString();

}

if (path) {

cookieText += "; path=" + path;

}

if (domain) {

cookieText += "; domain=" + domain;

}

if (secure) {

cookieText += "; secure";

}

} else {

cookieText += "; expires=" + Date(0).toGMTString();

}

document.cookie = cookieText;

/** 设置一条子cookie

* param name : 表示cookie的名称，必填

* param subName : 表示子cookie的名称，必填

* param value : 表示子cookie的值，必填

* param expires : 表示cookie的过期时间，可以不填

* param domain : 表示cookie的域名，可以不填

* param path : 表示cookie的路径，可以不填

* param secure : 表示cookie的安全标志，可以不填

* eg : SubCookieUtil.set("info", "sex", "boy");

**/

set : function (name, subName, value, expires, domain, path, secure) {

var cookies = this.getAll(name) || {};

cookies[subName] = value;

this.setAll(name, cookies, expires, domain, path, secure);

/** 读取一条完整cookie

* param name : 表示cookie的名称，必填

* return : 一个cookie对象

* eg : SubCookieUtil.getAll("info");

**/

getAll : function (name) {

var cookieName = encodeURIComponent(name) + "=",

cookieStart = document.cookie.indexOf(cookieName),

cookieValue = "", i, len, subCookies, parts, result = {};

if (cookieStart > -1) {

var cookieEnd = document.cookie.indexOf (";", cookieStart);

if (cookieEnd == -1) {

cookieEnd = document.cookie.length;

}

cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd));

if (cookieValue.length > 0) {

subCookies = cookieValue.split("&");

for (i = 0, len = subCookies.length; i < len; i++) {

parts = subCookies[i].split("=");

result[decodeURIComponent(parts[0])] = decodeURIComponent(parts[1]);

}

return result;

}

return null;

/** 获取一条子cookie的值

* param name : 表示cookie的名称，必填

* param subName : 表示子cookie的名称

* return : 一个子cookie的值

* eg : SubCookieUtil.get("info", "name");

**/

get : function (name, subName) {

var cookies = this.getAll(name);

if (cookies) {

return cookies[subName];

} else {

return null;

}

/** 删除一条完整cookie

* param name : 表示cookie的名称，必填

* param domain : 表示cookie的域名，可以不填

* param path : 表示cookie的路径，可以不填

* param secure : 表示cookie的安全标志，可以不填

* eg : SubCookieUtil.unsetAll("info");

**/

unsetAll : function (name, domain, path, secure) {

this.setAll(name, "", Date(0).toGMTString(), domain, path, secure);

/** 删除一条子cookie

* param name : 表示cookie的名称，必填

* param subName : 表示子cookie的名称，必填

* param domain : 表示cookie的域名，可以不填

* param path : 表示cookie的路径，可以不填

* param secure : 表示cookie的安全标志，可以不填

* eg : SubCookieUtil.unset("info", "name");

**/

unset : function (name, subName, domain, path, secure) {

var cookies = this.getAll(name);

if (cookies) {

delete cookies[subName];

this.setAll(name, cookies, null, domain, path, secure);

}

};

// 测试：

var zhang = {

name : "zhang",

age : 23,

height : "178cm",

weight : "66kg"

}

// 设置一条完整的cookie

SubCookieUtil.setAll("zhang", zhang);

// 获取一条完整的cookie

var zhang = SubCookieUtil.getAll("zhang");

alert(zhang.weight); // 66kg

// 再为张添加一个子cookie

SubCookieUtil.set("zhang", "sport", "basketball");

// 获取子cookie

alert(SubCookieUtil.get("zhang", "sport")); // basketball

// 删除一条子cookie

SubCookieUtil.unset("zhang", "age");

alert(SubCookieUtil.get("zhang", "age")); // undefined

// 删除一条完整的cookie

SubCookieUtil.unsetAll("zhang");

alert(SubCookieUtil.getAll("zhang")); // 报错，因为已经被删除

以上就是本文的全部内容，希望对大家的学习有所帮助。

总结

以上是生活随笔为你收集整理的把数据保存到cook_JavaScript数据存储 Cookie篇的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。

上一篇：显示行数设置ssh终端_linux限制
下一篇： java 转jsp_【转】JSP三种页面