我们已经知道,在 document 对象中有一个 cookie 属性。但是 Cookie 又是什么?“某些 Web 站点在您的硬盘上用很小的文本文件存储了一些信息,这些文件就称为 Cookie。”—— MSIE 帮助。一般来说,Cookies 是 CGI 或类似,比 HTML 高级的文件、程序等创建的,但是 JavaScript 也提供了对 Cookies 的很全面的访问权利。
在继续之前,我们先要学一学 Cookie 的基本知识。
每个 Cookie 都是这样的:cookie名=cookie值;cookie本身仅仅是一个字符串,是一组名值对;多组名值对用分号加空格分隔!
"cookie名"的限制与 JavaScript 的命名限制大同小异,少了“不能用 JavaScript 关键字”,多了“只能用可以用在 URL 编码中的字符”。后者比较难懂,但是只要你只用字母和数字命名,就完全没有问题了。“值”的要求也是“只能用可以用在 URL 编码中的字符”。
每个 Cookie 都有失效日期,一旦电脑的时钟过了失效日期,这个 Cookie 就会被删掉。我们不能直接删掉一个 Cookie,但是可以用设定失效日期早于现在时刻的方法来间接删掉它。
每个网页,或者说每个站点,都有它自己的 Cookies,这些 Cookies 只能由这个站点下的网页来访问,来自其他站点或同一站点下未经授权的区域的网页,是不能访问的。每一“组”Cookies 有规定的总大小(大约 2KB 每“组”),一超过最大总大小,则最早失效的 Cookie 先被删除,来让新的 Cookie“安家”。
访问Cookie
document.write(document.cookie);//输出类似"name1=value1; name2=value2; name3=value3"的字符串
document.write(typeof document.cookie);//cookie仅仅是个字符串
但这样获取到的是一堆混乱的字符串,必须对其进行处理才能知道它的含义!在类似ASP或PHP这样的服务器端脚本中,往往设置cookie十分简单
//ASP
response.cookies("cookieName")="cookieValue"
//PHP
setcookie("cookieName","cookieValue");
解析Cookie名值对
方案一:直接截取字符串
function getCookie(cookieName) {
var start = document.cookie.indexOf(cookieName+"=");
if (start ==-1) {return "";}
start = start+cookieName.length+1;
var end = document.cookie.indexOf(";",start);
if (end=-1) {end = document.cookie.length;}
return document.cookie.substring(start,end);
}
方案二:将Cookie拆分为数组,通过遍历取得
function getCookie(cookieName) {
var cookies=document.cookie.split("; ");//一个分号加一个空格
if (!cookies.length) {return "";}
var pair=["",""];
for (var i=0;i< cookies.length;i++) {
pair = cookies[i].split("=");//以赋值号分隔,第一位是Cookie名,第二位是Cookie值
if (pair[0]==cookieName) {
break;
}
}
return pair[1];
}
方案三:使用正则表达式解析
function getCookie(cookieName) {
var re = new RegExp("\\b"+cookieName+"=([^;]*)\\b");
var arr = re.exec(document.cookie);
return arr?arr[1]:"";
}
设置Cookie
一个Cookie包含以下信息:
•
Cookie名称,Cookie名称必须使用只能用在URL中的字符,一般用字母及数字
•
Cookie值,Cookie值同样也只能使用可以用在URL中的字符,一般需要在设置Cookie值时对其使用encodeURI方法进行转义
•
Expires,过期日期,一个GMT格式的时间,当过了这个日期之后,浏览器就会将这个Cookie删除掉,当不设置这个的时候,Cookie在浏览器关闭后消失
•
Path,一个路径,在这个路径下面的页面才可以访问该Cookie,一般设为“/”,以表示同一个站点的所有页面都可以访问这个Cookie
•
Domain,子域,指定在该子域下才可以访问Cookie,例如要让Cookie在bbs.x-life.com下可以访问,但在news.x-life.com下不能访问,则可将domain设置成bbs.x-life.com
•
Secure,安全性,指定Cookie是否只能通过https协议访问,一般的Cookie使用HTTP协议既可访问,如果设置了Secure(没有值),则只有当使用https协议连接时cookie才可以被页面访问
注意:Cookie安全机制要求站点页面只能访问本站点的Cookie,不能访问其它站点的Cookie。同时,最好在设置Cookie时使用encodeURI对象进行URI编码,在取出Cookie时再使用decodeURI对其进行解码!
设置一个完整Cookie示例var expires = new Date();
expires.setMonth(expires.getMonth()+1);//一个月后Cookie失效 或者是:expires.setTime(expires.getTime() + day*24*60*60*1000);
var s = "userName="+escape("sss")+"; expires="+expires.toGMTString()+";path=/";
document.cookie = "userName="+escape("sss")+"; expires="+expires.toGMTString()+";path=/";
每次设置document.cookie值时如果该Cookie名称并不存在,则新增一个Cookie,如果已经存在,则修改以前的值!
document.cookie = "a="+escape("1")+"; expires="+expires.toGMTString()+"; path=/";;//新增一个名称为a的Cookie
document.cookie = "a="+escape("1")+"; expires="+expires.toGMTString()+"; path=/";//新增一个名称为b的Cookie,原来的Cookie安然无恙
document.cookie = "a=3";//将原来的名称为a的Cookie值修改为3
function SetCookie(name,value,Days)//两个参数,一个是cookie的名子,一个是值
{
//var Days=30; //此 cookie 将被保存 30 天
var exp = new Date(); //new Date("December 31, 9998");
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name+"="+escape(value)+";expires="+exp.toGMTString()+"; path=/";//path是cookie的访问路径
}
//取cookies函数
function getCookie(name)
{
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null)
return unescape(arr[2]);
else
return null;
}
//删除cookie没有删除Cookie的直接的方法,但可以变通一下来删除Cookie!
function deleteCookie(name)
{
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}
允许浏览器的Cookie操作:Internet选项中,隐私 ---> 高级 --->覆盖自动cookie处理划勾,每一方:接受,第三方:接受。总是允许会话cookie划勾
Cookie存放的位置是:Internet选项中,常规,Internet临时文件,设置,看到Internet临时文件夹的路径。
名字: Cookie:"当前登录名"@127.0.0.1/
分享到:
相关推荐
javascript 操作cookiejavascript 操作cookiejavascript 操作cookie
js写的方法,可以设置cookie和获取cookie值,简单易懂
JS的COOKIE设置和清楚,写好的一个函数,方便调用,可直接写成函数的方式
Js 操作cookie源码封装Js 操作cookie源码封装
js操作Cookie子键+Jquery调用Ajax方法执行后台操作 返回值给前台。详细注释 Demo
js操作cookiejs操作cookiejs操作cookiejs操作cookie
js操作cookie.pdf
并且在Cookie详解这篇文章中,介绍了如何在服务器端和使用JavaScript创建Cookie,并设置属性。 我们知道,Cookie是存储在客户端的,并且现在前后端分离慢慢变得流行起来,因此如何在浏览器上可以使用方便快捷的...
js对cookie操作的封装 包含jquery对cookie的操作和纯javascript对cookie操作
用js设置cookie,并能读取 用js设置cookie,并能读取
用JavaScript操作Cookie实现菜单保存的一个实例,如果你正在编写一个JS层拖动的功能,那么这段代码可以帮你实现拖动位置的保存,让浏览器去保存用户拖动网页某个层的位置
cookie设置插件jquery.cookie.min.js 文章《javascript设置cookie高级篇可跨域访问》https://blog.csdn.net/cplvfx/article/details/117822956
javascript操作cookie /** * Read the JavaScript cookies tutorial at: * [url]http://www.netspade.com/articles/javascript/cookies.xml[/url] */ /** * Sets a Cookie with the given name and value. * * name...
JS操作Cookie 大全 可以实现购物车功能
有js设置和获取cookie 简单实用易看懂免费为大家分享 有兴趣的可以参与看看啊
代码如下: function ClearCookie() { var expires = new Date(); expires.setTime... //expires是对应过期时间的设置,不设这个值,cookie默认在关闭浏览器时失效 [removed] = “roleID=’333”’;path=/;expires=”