怎么使用JavaScript操作Cookie的过期时间?

答案:JavaScript通过document.cookie设置Cookie过期时间需使用expires属性并配合UTC格式日期字符串。核心方法是利用Date对象的toUTCString()生成正确格式的时间,并通过拼接字符串方式设置,若未设置expires则生成会话Cookie;常见做法是封装setCookie函数传入天数自动计算过期时间,同时指定path=/确保作用域覆盖全站;删除Cookie需将expires设为过去时间且必须匹配原Cookie的path和domain属性;影响Cookie生命周期的还有secure、HttpOnly和SameSite等关键属性,分别控制传输安全、脚本访问权限及跨站请求行为,其中path和domain设置不当常导致访问异常,是开发中易错点。

怎么使用javascript操作cookie的过期时间?

使用JavaScript操作Cookie的过期时间,核心在于设置

expires

属性。这个属性需要一个特定格式的日期字符串,通常是UTC时间,告诉浏览器这个Cookie应该在何时失效并被删除。如果你不显式设置这个属性,那么Cookie通常会成为一个会话Cookie,也就是在用户关闭浏览器时就会自动消失。

要通过JavaScript设置Cookie的过期时间,我们主要依赖

document.cookie

这个API。当你在设置一个Cookie时,可以通过追加

expires=DateString

来指定它的失效日期。这个

DateString

必须是GMT或UTC格式的日期字符串,最可靠的方式是使用

Date

对象的

toUTCString()

方法来生成。

一个常见的实践是创建一个辅助函数来管理Cookie的设置,这样可以更好地封装逻辑,比如计算未来某个日期的UTC字符串。

function setCookie(name, value, days) {    let expires = "";    if (days) {        const date = new Date();        // 计算从现在开始days天后的时间戳        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));        // 将日期转换为UTC字符串,这是Cookie expires属性要求的格式        expires = "; expires=" + date.toUTCString();    }    // 构造Cookie字符串,path=/ 是一个很重要的点,确保Cookie在整个网站都可用    document.cookie = name + "=" + (value || "") + expires + "; path=/";}// 示例:设置一个名为 'username',值为 'Alice',7天后过期的CookiesetCookie("username", "Alice", 7);// 示例:设置一个会话Cookie(不设置过期时间,浏览器关闭时失效)setCookie("session_id", "some_unique_id");// 示例:让一个Cookie立即过期(等同于删除),可以通过设置一个过去的日期setCookie("username", "", -1); // 传入-1天,使其立即过期

这里有一个很重要的点是

path=/

。如果你不指定

path

属性,Cookie默认只对当前路径及其子路径有效。这可能导致你在其他页面无法访问到你期望的Cookie,从而造成一些调试上的困扰。在实际生产环境中,你可能还需要考虑

secure

(仅HTTPS传输)和

SameSite

(CSRF保护)等属性,它们对Cookie的安全性至关重要。

立即学习“Java免费学习笔记(深入)”;

为什么Cookie的过期时间设置总是让人头疼?

说实话,Cookie的过期时间设置,尤其是通过

document.cookie

直接操作时,确实常常让人感到有些头疼。这主要有几个原因。首先,日期格式的严格要求是最大的一个坑。

expires

属性只认GMT/UTC格式的日期字符串,如果你不小心用了本地时间或者其他格式,Cookie可能根本不会按你预期的那样工作。

Date.prototype.toUTCString()

就是为了解决这个问题的,但初学者很容易忽略。

其次,时间计算本身就有点绕。我们需要把“几天后”转换成具体的毫秒数,再加到当前时间戳上,然后转换成日期对象,最后再格式化。这一系列操作,任何一步出错都可能导致Cookie失效时间不对。

再者,Cookie的生命周期不仅仅受

expires

(或

max-age

,虽然

expires

更老旧但兼容性广)影响,还和

path

domain

这些属性息息相关。如果一个Cookie的

path

domain

设置不正确,即使过期时间是对的,它也可能无法在预期的页面或子域下被访问到,这无疑增加了问题的复杂性。有时候,你明明看到Cookie存在,但就是用不了,多半就是这些属性在作祟。

除了过期时间,还有哪些Cookie属性会影响其生命周期和可用性?

除了

expires

(或

max-age

),Cookie还有几个非常重要的属性,它们共同决定了一个Cookie的生命周期、作用范围以及安全性。理解这些属性对于有效地管理Cookie至关重要:

path

: 这个属性定义了Cookie在哪个路径下是可用的。比如,

path=/

表示Cookie在整个网站的任何路径下都可用。如果设置为

path=/app

,那么Cookie只在

/app

及其子路径下可用。这是一个常见的误区,很多时候Cookie无法访问就是因为

path

设置不正确。

domain

:

domain

属性指定了Cookie所属的域名。如果未指定,默认是设置该Cookie的当前主机名(不包含子域名)。如果指定了,比如

domain=example.com

,那么Cookie对

example.com

及其所有子域名(如

www.example.com

,

blog.example.com

)都可用。但值得注意的是,你只能为当前域或其父域设置Cookie,不能为其他域设置。

secure

: 这是一个布尔属性。如果设置了

secure

,那么Cookie只会在HTTPS连接下发送到服务器。这意味着在HTTP连接中,浏览器不会发送这个Cookie,从而增加了传输的安全性,防止敏感信息被窃听。

HttpOnly

: 如果设置了

HttpOnly

,那么JavaScript将无法通过

document.cookie

API访问到这个Cookie。这个属性主要是为了防止跨站脚本攻击(XSS),即使攻击者成功注入了恶意脚本,也无法窃取到用户的Session Cookie。这是一个非常重要的安全特性。

SameSite

: 这是近年来非常重要的一个安全属性,用于防止跨站请求伪造(CSRF)攻击。它有三个值:

Lax

(默认值):在跨站请求中,只有GET请求且是顶级导航时(比如点击链接),才会发送Cookie。

Strict

:在所有跨站请求中都不发送Cookie。只有当请求是同站发起的,才会发送。

None

:在所有跨站请求中都发送Cookie,但必须同时设置

secure

属性(即Cookie只能通过HTTPS发送)。

这些属性共同编织了一张复杂的网,决定了Cookie何时、何地以及如何被使用。

如何有效地“删除”一个已经设置的Cookie?

要有效地“删除”一个已经设置的Cookie,其实并没有一个直接的

deleteCookie

方法。我们采取的策略是:将目标Cookie的过期时间设置为一个过去的日期。这样,浏览器在下次检查Cookie时,发现它已经过期,就会自动将其移除。

删除Cookie的关键在于,你必须提供与原始Cookie完全匹配的

name

path

domain

属性。如果这些属性不匹配,你可能只是创建了一个新的、立即过期的Cookie,而原始的Cookie仍然存在。

function deleteCookie(name, path = "/", domain = "") {    // 设置一个过去的日期,通常是1970年1月1日    const pastDate = "Thu, 01 Jan 1970 00:00:00 UTC";    let deleteString = name + "=; expires=" + pastDate + "; path=" + path;    // 如果原始Cookie设置了domain,这里也必须匹配    if (domain) {        deleteString += "; domain=" + domain;    }    // 将构造好的字符串赋值给document.cookie    document.cookie = deleteString;}// 示例:删除名为 'username' 的Cookie,假设它是在根路径 '/' 下设置的deleteCookie("username");// 示例:如果 'user_pref' Cookie是在 '/settings' 路径下设置的,你需要这样删除// deleteCookie("user_pref", "/settings");// 示例:如果 'analytics_id' Cookie是在 '.example.com' 域下设置的// deleteCookie("analytics_id", "/", ".example.com");

这里需要特别强调的是

path

domain

的匹配问题。一个常见的错误是,当一个Cookie是在

/app

路径下设置的,你却尝试用

path=/

去删除它。这会导致删除失败,因为浏览器会认为它们是两个不同的Cookie。因此,在删除Cookie时,一定要确保你提供的

path

domain

与原始Cookie设置时所用的值一致。如果不确定原始Cookie的

path

domain

,通常最安全的方式是尝试使用最广的范围(

path=/

和不指定

domain

或指定顶级域),但这并不总是奏效。在实际开发中,记录下你设置Cookie时的所有属性,以便后续精确删除,是一个很好的习惯。

以上就是怎么使用JavaScript操作Cookie的过期时间?的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1521194.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
JS 内存分配机制解析 – V8 引擎隐藏类与内联缓存的优化原理
上一篇 2025年12月20日 13:57:53
什么是JavaScript的迭代协议和异步迭代协议,以及它们如何统一遍历不同数据源的方式?
下一篇 2025年12月20日 13:58:20

相关推荐

  • 如何开启无痕浏览:谷歌浏览器极简操作指南

    本文将详细介绍如何在谷歌浏览器(Chrome)中开启无痕浏览模式。通过本指南,您将学习到在桌面和移动设备上启动无痕窗口或标签页的具体步骤。无痕模式是一个实用的隐私功能,它能在一个独立的会话中进行浏览,关闭窗口后不会在设备上留下痕迹,下文将为您分步解析操作流程。 立即进入“免费看电影的软件☜☜☜☜☜点…

    2026年9月5日
    000
  • 美团机票特惠券领取入口_美团机票优惠获取方法

    答案:可通过美团APP首页交通出行入口、限时主题活动及小程序推送领取机票优惠券。打开美团APP,点击“火车/机票”进入后领券;搜索“机票减200”等活动关键词参与专题领券;关注美团小程序消息,获取个性化推送优惠券。 如果您在规划出行时发现机票价格较高,可以通过领取美团平台的特惠券来降低购票成本。以下…

    2026年9月5日
    000
  • 谷歌浏览器无痕记录能查出来吗 如何查看浏览器的无痕浏览记录

    许多用户都对谷歌浏览器的无痕模式抱有疑问:关闭窗口后,浏览记录真的就消失了吗?是否还有方法可以查出来?本文将深入探讨这一问题,为您详细解析无痕模式下数据处理的原理,并说明在何种情况下浏览记录可能被追溯,以及为什么常规方法无法查看这些记录。 立即进入“免费看电影的软件☜☜☜☜☜点击进入”; 无痕模式的…

    2026年9月5日
    300
  • Win10系统 Edge:发生临时dns错误 怎么办?

    Win10系统 Edge:发生临时dns错误 怎么办?Win10系统 Edge:发生临时dns错误 怎么办?Win10系统 Edge:发生临时dns错误 怎么办?Win10系统 Edge:发生临时dns错误 怎么办?

    win10 edge:出现临时dns错误怎么办?在windows 10系统中,microsoft edge作为新一代的内置浏览器,已经取代了ie浏览器,而ie则被微软移除。不过,ie仍然保留在系统中。最近有用户反映,在使用edge浏览器浏览网页时,出现了“出现临时dns错误”的提示,导致网页无法正常…

    2026年9月5日 用户投稿
    000
  • WPS文档怎样转为Word_WPS文档转为Word的实用方法介绍

    可通过WPS的“另存为”功能将文档转为.docx或.doc格式;2. 使用在线工具如Smallpdf上传WPS文件并转换为Word;3. 复制WPS内容粘贴至新建Word文档;4. 借助AnyConv等第三方软件批量离线转换。 如果您需要将WPS文档内容在不同设备或软件中使用,但接收方无法打开WPS…

    2026年9月5日
    000
  • 谷歌浏览器如何开启无痕浏览模式访问网页

    本文将为您详细介绍如何在谷歌浏览器中开启并使用无痕浏览模式来访问网页。通过本教程,您将掌握在桌面和移动设备上启动无痕窗口或标签页的具体步骤。这个过程非常简单,下文将分步进行讲解,让您轻松学会在一个不保存本地记录的私密环境中进行网络浏览。 立即进入“免费看电影的软件☜☜☜☜☜点击进入”; 什么是无痕浏…

    2026年9月5日
    100
  • 高德鹰眼守护预警会很耗电吗_高德鹰眼守护预警耗电情况真实测评

    开启“鹰眼守护”功能会增加一定耗电,主要因GPS、网络传输和后台运算持续运行。实测显示,60分钟城市导航耗电约6%(iPhone 15 Pro),4小时高速行驶耗电约22%(安卓5000mAh电池),信号弱区域耗电提升15%-20%。通过关闭屏幕常亮、启用省电模式、使用车载充电及更新App可有效降低…

    2026年9月5日
    200
  • 浏览器无痕浏览模式开启后还会被查到浏览记录吗

    关于浏览器无痕模式开启后,浏览记录是否还可能被查到,是许多用户关心的问题。本文将深入解析无痕模式的真实作用,明确它能清除哪些数据,而哪些信息依然可能被追踪。通过下文的讲解,您将理解无痕模式的隐私保护边界,并了解在何种情况下浏览活动可能被追溯。 立即进入“免费看电影的软件☜☜☜☜☜点击进入”; “无痕…

    2026年9月5日
    100
  • Java面试题库哪里找?

    高效备战Java面试:精选题库推荐 Java面试准备的关键在于充分了解常见面试题型。本文推荐一个GitHub资源,助你轻松应对Java面试挑战。 许多Java面试题反复出现,因此拥有一个高质量的题库至关重要。以下GitHub仓库提供了海量Java面试题,涵盖核心技术、常用框架和开发工具等方面: Ja…

    2026年9月5日
    500
  • 浏览器开启无痕浏览模式看片后会被发现吗

    许多用户在使用浏览器的无痕模式时,尤其是在观看视频内容后,会关心自己的行为是否真的不留痕迹,会不会被发现。本文将深入探讨这一问题,为您详细解析无痕模式的真实作用范围,明确它能隐藏什么,又有哪些信息是无法隐藏的,从而帮助您更准确地理解其隐私保护的边界。 立即进入“免费看电影的软件☜☜☜☜☜点击进入”;…

    2026年9月5日
    100
  • Firefox出现严重零日漏洞,提醒用户尽快升级最新版本

    mozilla 推出了 firefox 67.0.3 和 firefox esr 60.7.1 更新,旨在紧急解决一个刚被发现的 0day 漏洞。安全公告中详细说明了问题:在 array.pop 的处理过程中存在缺陷,导致操作 javascript 对象时可能发生类型混淆漏洞。这一情况可能会引发可被…

    2026年9月5日
    400
  • Maven pom.xml 中resource配置有何作用?

    理解Maven pom.xml 中的resource配置 Maven项目构建过程中,pom.xml 文件中的 配置项用于指定需要包含在最终构建包(例如JAR或WAR)中的额外资源文件。 默认情况下,Maven会自动包含src/main/resources目录下的所有文件。然而,有时需要更精细的控制,…

    2026年9月5日
    000
  • WordPress插件邮件通知接收者自定义指南

    本文详细介绍了如何在不修改插件核心文件的前提下,利用WordPress的过滤器(Filter Hook)机制,自定义第三方插件(如Booking Activities)的邮件通知接收者。通过分析过滤器参数、编写自定义函数并注册到bookacti_email_notification_data钩子,您…

    2026年9月5日
    000
  • 英伟达平台上线DeepSeek R1

    nvidia发布deepseek r1推理开放模型,现已在nvidia nim平台提供预览版。 ☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ DeepSeek R1是一款先进的开放模型,其强大的推理能力使其能够胜任复杂逻辑推理、数学计算、编…

    2026年9月5日
    000
  • 交管12123驾考自主约考功能怎么用_交管12123驾考自主约考功能详解

    交管12123驾考自主约考功能怎么用_交管12123驾考自主约考功能详解交管12123驾考自主约考功能怎么用_交管12123驾考自主约考功能详解交管12123驾考自主约考功能怎么用_交管12123驾考自主约考功能详解交管12123驾考自主约考功能怎么用_交管12123驾考自主约考功能详解

    首先确认具备预约资格,登录“交管12123”APP后进入【驾驶证业务】→【考试预约】,选择考试科目与考场,阅读须知并同意,再选择自主或服从安排的预约模式,核对信息后输入验证码提交申请,最后通过【网办进度】查询结果。 如果您已完成驾考相关学时并通过审核,具备了预约考试的资格,但不知道如何使用“交管12…

    2026年9月5日 用户投稿
    000
  • windows查看端口占用 windows端口占用 查找端口占用程序 强制结束端口占用 查看某个端口被占用的解决方法 如何查看Windows下端口占用情况

    windows查看端口占用 windows端口占用 查找端口占用程序 强制结束端口占用 查看某个端口被占用的解决方法 如何查看Windows下端口占用情况windows查看端口占用 windows端口占用 查找端口占用程序 强制结束端口占用 查看某个端口被占用的解决方法 如何查看Windows下端口占用情况windows查看端口占用 windows端口占用 查找端口占用程序 强制结束端口占用 查看某个端口被占用的解决方法 如何查看Windows下端口占用情况windows查看端口占用 windows端口占用 查找端口占用程序 强制结束端口占用 查看某个端口被占用的解决方法 如何查看Windows下端口占用情况

    在windows 10系统下,如何查询和强制结束占用8080端口的程序?以下是详细步骤: 首先,在控制台执行命令,列出所有端口的使用情况: netstat -ano 接下来,查询指定的8080端口被占用的情况。在上图中,本地地址列中的冒号后面的数字即为端口号: netstat -aon|findst…

    2026年9月5日 用户投稿
    100
  • 夸克电脑浏览器怎么清除缓存_夸克浏览器缓存清理步骤

    清理夸克电脑浏览器缓存可解决页面加载异常、显示旧内容或运行缓慢问题。一、通过设置菜单清除:点击右上角菜单→设置→隐私与安全→清除浏览数据→勾选“缓存文件和图片”→选择时间范围→点击清除数据。二、使用快捷键方式:在主界面按下Ctrl+Shift+Delete→打开清除浏览数据对话框→选择时间范围并仅勾…

    2026年9月5日
    000
  • ​​HTTP与HTTPS的区别是什么?哪个更安全?​​

    https通过ssl/tls加密、身份验证和数据完整性保障安全,1. 数据加密确保传输内容不被窃取,2. 身份验证防止中间人攻击,3. 数据完整性检测防止篡改;虽然https更安全,但http因无需加密计算,在静态内容场景仍适用;http默认使用80端口,https使用443端口,便于服务区分;证书…

    2026年9月5日
    100
  • 通过ssh连接aws(亚马逊 云服务器 实例)

    通过ssh连接aws(亚马逊 云服务器  实例)通过ssh连接aws(亚马逊 云服务器  实例)通过ssh连接aws(亚马逊 云服务器  实例)通过ssh连接aws(亚马逊 云服务器  实例)

    一、windows用户 (1)第一步:配置服务器信息 打开xshell,新建连接,在菜单“连接”填写服务器信息,主机选项可以填写AWS实例的DNS地址,也可以填写外网IP,端口默认,其它内容不是重点,不再赘述。 (2)第二步:浏览当初创建实例保存在本地的.pem文件,即密钥,我的是key.pem 选…

    2026年9月5日 用户投稿
    100
  • 讯飞星火怎么帮我学习外语_讯飞星火外语学习辅助功能

    讯飞星火通过个性化口语陪练、智能词汇记忆、语法解析与写作润色、阅读理解与文化背景补充四大核心功能,提供远超翻译工具的外语学习支持。它能实时纠正发音偏差,模拟真实对话场景提升口语表达;基于遗忘曲线智能推荐词汇,并结合语境造句拓展用法;深入分析语法错误并解释修改原因,辅助写作逻辑与语言地道性提升;在阅读…

    2026年9月5日
    000

发表回复

登录后才能评论
关注微信