讲师中心 微信公众号
AI工具推荐 视频效率加速

javascript的Cookie如何操作_怎样读写和删除Cookie?

冬芳姑娘_8785

冬芳姑娘_8785

发布时间:2025-12-31 04:59:24

|

893人浏览过

|

来源于php中文网

原创

JavaScript操作Cookie通过document.cookie实现,读取返回分号分隔字符串,写入需按name=value; expires=...格式赋值,删除需覆盖并设过期时间,且path/domain必须匹配原设置。

javascript的cookie如何操作_怎样读写和删除cookie?

JavaScript 操作 Cookie 主要是通过 document.cookie 这个属性来完成的,它看起来像一个变量,但实际是**读写接口**:读取时返回当前域名下所有可用 Cookie 的字符串(用分号分隔),写入时则需按特定格式赋值才能设置或更新。

如何写入(设置)Cookie

设置 Cookie 就是给 document.cookie 赋值一个符合格式的字符串。基本结构为:

name=value; expires=GMTString; path=/; domain=.example.com; secure; HttpOnly(JS不可读)

其中只有 name=value 是必需的,其它都是可选属性。常用操作示例:

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

Revealjs Presentations
Revealjs Presentations

创建、编辑并部署 reveal.js 演示文稿为单个 HTML 文件,可选自定义 CSS。适用于需要制作演示文稿、幻灯片或宣传材料时使用。

下载
  • 简单设置:document.cookie = "username=john";(会话级 Cookie,关闭浏览器即失效)
  • 带过期时间(7天后):document.cookie = "token=abc123; expires=" + new Date(Date.now() + 7*24*60*60*1000).toUTCString();
  • 指定路径和域名(让子路径也能访问):document.cookie = "theme=dark; path=/; domain=.site.com";
  • 安全标记(仅 HTTPS 传输):document.cookie = "sessionid=xyz; secure; SameSite=Strict";

如何读取 Cookie

document.cookie 读取返回的是一个类似 "a=1; b=2; c=3" 的字符串,没有内置解析方法,需要手动处理:

  • split('; ') 拆成键值对数组
  • 再对每个项用 split('=') 分离 key 和 value
  • 注意空格和 URL 编码(中文或特殊字符需用 encodeURIComponent/decodeURIComponent

常用封装函数示例:

function getCookie(name) {
  const cookies = document.cookie.split('; ');
  for (let cookie of cookies) {
    const [key, value] = cookie.split('=');
    if (key === name) return decodeURIComponent(value);
  }
  return null;
}

如何删除 Cookie

Cookie 本身不能直接“删除”,只能通过覆盖的方式让它立即过期:

  • expires 设为过去的时间(如 1970 年)
  • 必须保证 pathdomain 与当初设置时完全一致,否则删不掉
  • 推荐写法:document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";

注意事项和替代方案

原生 Cookie 操作繁琐、易出错,且有大小限制(单个约 4KB,总数量也有限)。现代项目中建议:

  • 优先使用 localStoragesessionStorage 存储非敏感前端数据
  • 涉及登录态、权限等关键信息,仍应由后端设 Cookie(含 HttpOnlySecure),前端只负责触发登录/登出逻辑
  • 若必须 JS 操作 Cookie,可引入轻量库如 js-cookie 简化流程

基本上就这些。不复杂但容易忽略 path/domain 匹配和编码问题,写的时候多检查两遍就行。

相关文章

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
Atoms
Atoms Hot

Atoms是一款AI智能体工具,第一支自动构建真实业务的 AI 团队。

Laper
Laper Hot

Laper是专为编剧、导演和制片人推出的 AI 原生剧本创作工具。

二狗PPT
二狗PPT Hot

一款AI演示文稿工具,主要用于专为中式职场打造的AI PPT生成工具,适合需要提升相关任务效率的用户。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

墨刀AI
墨刀AI Hot

一款AI图像与设计工具,主要用于产品经理的专属智能体,适合需要提升相关任务效率的用户。

AionClaw
AionClaw Hot

AionClaw是一款面向办公、创作和编程任务的AI桌面智能体。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

SkildArt
SkildArt Hot

SkildArt是一款AI文本写作工具,一站式 AI 视觉创作平台。

相关专题

更多
cookie
cookie

Cookie 是一种在用户计算机上存储小型文本文件的技术,用于在用户与网站进行交互时收集和存储有关用户的信息。当用户访问一个网站时,网站会将一个包含特定信息的 Cookie 文件发送到用户的浏览器,浏览器会将该 Cookie 存储在用户的计算机上。之后,当用户再次访问该网站时,浏览器会向服务器发送 Cookie,服务器可以根据 Cookie 中的信息来识别用户、跟踪用户行为等。

10679

2023.06.30

document.cookie获取不到怎么解决
document.cookie获取不到怎么解决

document.cookie获取不到的解决办法:1、浏览器的隐私设置;2、Same-origin policy;3、HTTPOnly Cookie;4、JavaScript代码错误;5、Cookie不存在或过期等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

886

2023.11.23

阻止所有cookie什么意思
阻止所有cookie什么意思

阻止所有cookie意味着在浏览器中禁止接受和存储网站发送的cookie。阻止所有cookie可能会影响许多网站的使用体验,因为许多网站使用cookie来提供个性化服务、存储用户信息或跟踪用户行为。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

704

2024.02.23

cookie与session的区别
cookie与session的区别

本专题整合了cookie与session的区别和使用方法等相关内容,阅读专题下面的文章了解更详细的内容。

1726

2025.08.19

登录token无效
登录token无效

登录token无效解决方法:1、检查token的有效期限,如果token已经过期,需要重新获取一个新的token;2、检查token的签名,如果签名不正确,需要重新获取一个新的token;3、检查密钥的正确性,如果密钥不正确,需要重新获取一个新的token;4、使用HTTPS协议传输token,建议使用HTTPS协议进行传输 ;5、使用双因素认证,双因素认证可以提高账户的安全性。

11586

2023.09.14

登录token无效怎么办
登录token无效怎么办

登录token无效的解决办法有检查Token是否过期、检查Token是否正确、检查Token是否被篡改、检查Token是否与用户匹配、清除缓存或Cookie、检查网络连接和服务器状态、重新登录或请求新的Token、联系技术支持或开发人员等。本专题为大家提供token相关的文章、下载、课程内容,供大家免费下载体验。

1405

2023.09.14

token怎么获取
token怎么获取

获取token值的方法:1、小程序调用“wx.login()”获取 临时登录凭证code,并回传到开发者服务器;2、开发者服务器以code换取,用户唯一标识openid和会话密钥“session_key”。想了解更详细的内容,可以阅读本专题下面的文章。

3057

2023.12.21

token什么意思
token什么意思

token是一种用于表示用户权限、记录交易信息、支付虚拟货币的数字货币。可以用来在特定的网络上进行交易,用来购买或出售特定的虚拟货币,也可以用来支付特定的服务费用。想了解更多token什么意思的相关内容可以访问本专题下面的文章。

5221

2024.03.01

AI视频生成软件推荐
AI视频生成软件推荐

本专题汇总了当前主流的AI视频生成软件推荐与排行榜单,涵盖seko、AniShort、剧云、Lovart、LiblibAI及立刻mv等热门工具。同时整理了各软件在文生视频、图生视频、时长限制、画质表现及免费额度等方面的差异对比,助您快速选对适合创作需求的AI视频生成工具。

120

2026.09.16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 11.8万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.5万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn