javascript入门经典--笔记9 cookie

最新推荐文章于 2022-11-15 22:45:48 发布

原创最新推荐文章于 2022-11-15 22:45:48 发布 · 587 阅读

1 ·

CC 4.0 BY-SA版权

本文详细介绍了如何创建和使用Web Cookie，包括其组成部分、过期时间设置、安全性考虑及示例代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一个cookie的例子：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

 document.cookie = "UserName = paul;expires=Tue, 28 Dec 2020 00:00:00;";

</script>
</head>
<body>
<p>This page just created a kookie</p>
</body>
</html>

cookie字符串

当创建一个cookie 时，需要创建一个cookie字符串，包含 6 个子串： name , value , expires(过期时间), path(路径), domain(域)和secure(安全)。其中后面4 个是可选的

name 用来引用该cookie ，value 则是该cookie 所保存的信息。name/value 对是必须要设置的，且需要放置在字符串开始。

UserName = paul;

上面即为名为Username , 值为 paul .

expires ，如果不设置，则为会话cookie，用户关闭浏览器之后cookie就过期。过期时间的格式根重要，必须与 toGMTString( ) 方法返回的格式相同。该方法用于发挥一个Date 对象的 GMT 时间。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
/*获取当前时间*/
var expireDate = new Date();
/*将过期时间设置为当前时间+7秒之后*/
expireDate.setMilliseconds(expireDate.getMilliseconds()+7000);
/*这里注意需要将日期格式设置为GMT格式*/
document.cookie = "UserName = paul;expires="+expireDate.toGMTString()+";";  /*这里expireDate.toGMTString()为什么加双引号？？？*/
</script>
</head>
<body>
<p>This page just created a kookie</p>
</body>
</html>

但是如果用户删掉cookie 或者浏览器所能支持的 cookie 数量达到上限，cookie就在在过期时间之前失效。

secure：是一个布尔值，如果设置为true，则该cookie 将仅在浏览器和服务器通过SSL（安全套接层）安全协议连接时才会被传输。通常情况下不用指定，只通过一个普通的HTTP 连接来传输。

创建cookie

创建一个cookie函数：

function setCookie (cookieName,cookieValue,cookiePath,cookieExpires){	
/*将特殊字符进行编码*/
	cookieValue=escape(cookieValue);
	if(cookieExpires==""){
		var nowDate = new Date();  
		nowDate.setMonth(nowDate.getMonth()+6);
		cookieExpires=nowDate.toGMTSrting();
	}
	if(cookiePath!=""){
		cookiePath="; path="+cookiePath;	
	}
	document.cookie=cookieName+"="+cookieValue+";"+"cookieExpires="+cookieExpires+";"+cookiePath;	
}

cookie中name以及value中不可以含有特殊字符，比如空格，分号等等，这里的escape( )函数将可以对特殊字符进行转义，将非字母转义成十六进制编码。同样可以用 unescape（）来解码。

使用setCookie 函数：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>set cookie</title>
<script type="text/javascript">
function setCookie (cookieName,cookieValue,cookiePath,cookieExpires){	
	cookieValue=escape(cookieValue);
	if(cookieExpires==""){
		var nowDate = new Date();  
		nowDate.setMonth(nowDate.getMonth()+6);
		cookieExpires=nowDate.toGMTString();
	}
	if(cookiePath!=""){
		cookiePath="; path="+cookiePath;	
	}
  /*设置cookie函数*/
 document.cookie=cookieName+"="+cookieValue+";"+"cookieExpires="+cookieExpires+";"+cookiePath;	
}
setCookie("Name","bob","","");
setCookie("Age","18","","");
setCookie("FirstVisite","10 may 2007","","");
alert(document.cookie);
</script>
</head>
<body>

</body>
</html>