Cookie的过期时间设置

本文详细介绍了Cookie的最大生存时间设置方法及其对Cookie的影响。包括如何通过setMaxAge()方法设置不同的生存时间,以及这些设置如何影响Cookie的生命周期。

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

1.Cookie生存时间介绍

我们知道Cookie是一个键值对,但是Cookie不仅仅只有name和value属性,它还有以下几种属性:
(1)注释:描述此 cookie 的用途;
(2)路径:指的是浏览器将此 cookie 返回到服务器上的路径,并且该cookie 对于服务器上的所有子路径都是可见的。
(3)域限定符:创建 cookie时设置的域名,域名形式是根据 RFC 2109 设置的;
(4)最大生存时间:表示cookie的存活时间,过了设置的最大生存时间,该cookie就会死亡;
(5)版本号:表示cookie遵守的协议版本,版本 1遵守RFC 2109,版本0遵守根据 Netscape 起草的原始 cookie 规范。
本文档只对Cookie的最大生存时间进行讲解,其他属性后面会一一说明。
Cookie的过期时间即为Cookie的最大生存时间,可以通过以下方法进行设置,如下所示:

  • void setMaxAge(int expiry)

该方法的参数的类型是整型,表示过期的时间,单位是秒。例如:cookie.setMaxAge(60)表示当前cookie会被浏览器保存在硬盘上,60秒后会被浏览器删除。
下面分情况说明cookie的setMaxAge()方法对cookie生存时间的设置,如下所示:

  • setMaxAge()参数大于0:表示将当前cookie保存在硬盘上,保存时间由其参数决定;
  • setMaxAge()参数小于0:无论该方法的参数是多少,只要小于0,则表示将当前cookie保存在浏览器内存中,浏览器关闭的同时cookie死亡;
  • setMaxAge()参数等于0:表示浏览器将当前cookie及之前保存的同名cookie删除,例如刚开始在浏览器端保存了一个cookie,名称为history,保存时间为2天,现在希望将该history删除,这个时候就可以向浏览器端再次发送一个名字为history的cookie,生存时间设置为0。这个时候浏览器会将名字为history的所有cookie删除。

如果,在服务器端新建一个cookie,并没有给该cookie设置生存时间,那么表示:该cookie会在浏览器关闭的时候被浏览器删除。

2.Cookie设置生存时间练习

通过以上对cookie生存时间的了解,下面通过一个案例来直观的体会cookie的生存时间设置对cookie的影响,具体如下:
(1)创建一个web项目,Example19,在该应用下的WebRoot目录下新建一个jsp文件,名称为cookieSet.jsp,主要代码如例1-1所示:
例1-1 cookieSet.jsp
  <body>
  <h1>保存cookie</h1>
    <%
      Cookie cookie1=new Cookie("cookie1","aaa");
      response.addCookie(cookie1);
     %>
  </body>
例1-1中,创建了一个cookie,但是并没有设置cookie的生存时间,通过以上对cookie生存时间的讲解,该cookie会在浏览器关闭的时候被销毁。
(2)将Example19发布到Tomcat服务器中,然后启动服务器,谷歌浏览器查看cookie比较方便,我们在谷歌浏览器端地址栏上访问:http://localhost:8080/Example19/cookieSet.jsp,浏览器显示结果如图1-1所示:

图1-1 浏览器显示结果
(3)查看谷歌浏览器中的cookie,点击图1-1所示的红色标注的图标,在下拉选项中选择【设置】,进入图1-2所示界面:

图1-2 查看cookie
(4)点击图1-2中的【内容设置】选项,进入图1-3所示界面:

图1-3 查看cookie
(5)点击图1-3中的【所有Cookie和网站数据…】按钮,进入图1-4所示界面:

图1-4 查看cookie
(6)点击图1-4所示的【cookie1】按钮,进入图1-5所示界面:

图1-5 cookie信息
由图1-5可知,名字为cookie1的cookie的过期时间为浏览会话结束时,即表示浏览器关闭,cookie被删除。
(7)关闭浏览器,再次打开浏览器,查看cookie1是否还存在,如图1-6所示:

图1-6 cookie信息
由图1-6所示,浏览器中已经不存在名为cookie1的cookie。
(8)对例1-1中的代码进行修改,如例1-2所示:
例1-2 cookieSet.jsp
  <body>
  <h1>保存cookie</h1>
    <%
      Cookie cookie1=new Cookie("cookie1","aaa");
      cookie1.setMaxAge(60*60)
      response.addCookie(cookie1);
     %>
  </body>
例1-2中,将cookie1的生存时间设置为1小时。
(9)在浏览器端再次访问cookieSet.jsp页面,查看浏览器中cookie1的保存时间,如图1-7所示:

图1-7 cookie信息
由图1-7可知,cookie1的保存时间是10:08:12,过期时间是:11:08:12,其生存时间正好是1个小时。
cookie1在浏览器端的存活时间是1小时,浏览器关闭后再打开,cookie1仍然存在,现在我们通过代码来将cookie1从浏览器端删除。
(10)在Example19应用的WebRoot目录下,新建一个jsp文件,名称为cookieGet.jsp,主要代码如例1-3所示:
例1-3 cookieGet.jsp
<body>
  <h1>删除cookie</h1>
    <%
      Cookie cookie=new Cookie("cookie1","aaa");
      cookie.setMaxAge(0);
      response.addCookie(cookie);
     %>
  </body>
例1-3中,再次新建一个名字为cookie1的cookie,并且设置其过期时间为0,表示浏览器立即删除当前及之前保存的名字为cookie1的cookie。
(11)重新启动服务器,在浏览器端地址栏上输入:http://localhost:8080/Example19/cookieGet.jsp,然后查看浏览器端的cookie1是否还存在,如图1-8所示:

图1-8 查看cookie
由图1-8可知,浏览器端的cookie1已经不存在了,它原本的生存时间是1小时,经过cookieGet.jsp页面中代码的设置,没有到过期时间就被浏览器删除了。

转载于:https://my.oschina.net/u/3442347/blog/1506699

<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、付费专栏及课程。

余额充值