设置cookie过期时间

本文展示了一个在Tomcat环境下,通过index.jsp页面设置Cookie,并使用URL重定向到test.jsp页面来读取Cookie值的示例。index.jsp页面通过JavaScript脚本和Java代码设置了一个名为'username'的Cookie,该Cookie被设置为1小时后过期。随后,页面将重定向到test.jsp,该页面接收并解码Cookie值,显示在控制台上。

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

一、tomcat访问web项目的index.jsp,会自动sendRedirect到test.jsp页面,test.jsp页面请求接受index.jsp的响应。
index.jsp
<%@page import="java.net.URLEncoder"%>  页面头部引入
<body>
     <script type="text/javascript">
	    alert("add cookie");
	<%--  <%  
	        Cookie cookie=null;
	         String cas_user = "小明"; 
	        if(request.getCookies()!=null)
	            cookie=null;
	        cookie = new Cookie("cas_bbs_sso",cas_user);
	        cookie.setPath("/");
	        response.addCookie(cookie); 
	  %>   --%>
	  <%
	  		Cookie cookie= new Cookie("username",URLEncoder.encode("小明","utf-8"));
	  		cookie.setMaxAge(60*60);/* cookie设置为1小时候过期 */ 
	  		cookie.setPath("/");
	  		response.addCookie(cookie);
	  		response.sendRedirect("test.jsp");
	  %>
	    
		
	</script>
	
		
	<h1>Hello cookie!</h1>
  </body>


二、test.jsp
<%@page import="java.net.URLDecoder"%> 页面头部引入
<body>
   <script type="text/javascript">
   alert("add cookie! HEllO COOKIE");
   		 <%
   			Cookie[] cookies = request.getCookies();
   			
   			 String s="";
   			if(cookies!=null){
   				for(int i=0;i<cookies.length;i++){
   					if(cookies[i].getName().equals("username")){
   						System.err.print(URLDecoder.decode(cookies[i].getValue(),"utf-8"));
   					}
   				}
   			} 
   		
   		%>
   		 
   </script>
  </body>
<think>嗯,用户问的是前端如何设置Cookie过期时间。首先,我得回忆一下Cookie的基本机制。Cookie可以通过JavaScript来设置,其中过期时间是一个重要的属性。 记得Cookie过期时间是通过`expires`或者`max-age`属性来控制的。`expires`接受一个GMT格式的日期字符串,而`max-age`则是以秒为单位的相对时间。不过要注意,有些旧版本的浏览器可能不支持`max-age`,所以可能需要同时设置这两个属性来确保兼容性。 接下来,我应该分步骤说明如何设置。比如,使用`document.cookie`来赋值,格式应该是"key=value; expires=date; path=/"。需要生成一个未来的日期,可以用`Date`对象,比如设置7天后过期,然后转换成UTC字符串。 然后,还要提到`max-age`的用法,比如设置`max-age=604800`(7天的秒数)。但要注意兼容性问题,可能的话同时设置`expires`和`max-age`会更稳妥。 另外,用户可能想知道不同框架或库中的方法,比如Vue或React中的操作,但其实底层还是调用原生JavaScript。不过可能需要提到第三方库如js-cookie,简化操作,比如`Cookies.set('name', 'value', { expires: 7 })`,这样更方便。 还需要提醒用户注意安全相关属性,比如`Secure`、`HttpOnly`,但这些通常在后端设置。前端设置时,路径`path`和域`domain`也很重要,确保Cookie在正确的范围和路径下生效。 最后,总结一下步骤,并给出示例代码,确保用户能清楚看到不同方法的实现。可能还要提到删除Cookie的方法,即设置过期时间为过去的时间,这样浏览器会自动删除。</think>好的,我来逐步解释前端设置 Cookie 过期时间的方法: --- ### 一、Cookie 过期机制 Cookie 通过 `expires` 或 `max-age` 属性控制过期时间: - **`expires`**: 设置 GMT 格式的绝对时间 (如 `Thu, 01 Jan 2026 00:00:00 GMT`) - **`max-age`**: 设置以秒为单位的相对时间 (如 `604800` 表示 7 天) --- ### 二、原生 JavaScript 设置方法 #### 1. 使用 `expires` (兼容性更好) ```javascript // 设置 Cookie 并指定 7 天后过期 const date = new Date(); date.setTime(date.getTime() + 7 * 24 * 60 * 60 * 1000); // 计算 7 天后的时间戳 document.cookie = "username=John; expires=" + date.toUTCString() + "; path=/"; ``` #### 2. 使用 `max-age` (现代浏览器推荐) ```javascript // 设置 Cookie 并指定 1 小时后过期 (3600 秒) document.cookie = "theme=dark; max-age=3600; path=/"; ``` --- ### 三、兼容性写法 (同时指定两者) ```javascript const date = new Date(); date.setTime(date.getTime() + 365 * 24 * 60 * 60 * 1000); // 1 年后 document.cookie = `lang=zh-CN; expires=${date.toUTCString()}; max-age=31536000; path=/`; ``` --- ### 四、使用第三方库 (推荐) 通过 `js-cookie` 库简化操作: 1. 安装库 ```bash npm install js-cookie ``` 2. 代码示例 ```javascript import Cookies from 'js-cookie'; // 设置 30 分钟后过期 Cookies.set('token', 'abc123', { expires: 0.5 }); // 0.5 天 = 12 小时 // 设置 7 天后过期 Cookies.set('preferences', '{darkMode: true}', { expires: 7 }); ``` --- ### 五、注意事项 1. **路径与域**: ```javascript document.cookie = "key=value; expires=...; path=/; domain=.example.com"; ``` 2. **安全属性**: - `Secure`: 仅 HTTPS 协议传输 - `HttpOnly`: 禁止 JavaScript 访问 (需后端设置) - `SameSite`: 控制跨站请求 Cookie 发送 3. **删除 Cookie**: ```javascript document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/"; ``` --- ### 六、验证方法 通过浏览器开发者工具检查: 1. 打开 `Application` 面板 2. 在 `Storage > Cookies` 下查看具体域名 3. 确认 `Expires/Max-Age` 值是否符合预期 --- 通过上述方法,您可以精确控制 Cookie 的生命周期。建议优先使用 `max-age` 简化时间计算,同时注意生产环境中设置合理的过期时间以保证安全性。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值