document.cookie写入必须显式指定path=/才能跨路径访问，中文需encodeuricomponent编码，读取后须decodeuricomponent解码，删除需用相同path/domain设置过期时间，httponly cookie无法通过js读取。

document.cookie 赋值写入必须带 key=value 格式，且不能省略分号分隔

直接 document.cookie = "theme=dark" 看似能写入，但实际会隐式加上默认 path=/current/path，导致在其他路由下读不到。真正跨路径可用的写法必须显式声明 path：

• document.cookie = "theme=dark; path=/"; —— 全站可读
• document.cookie = "token=abc123; path=/api/; domain=.example.com"; —— 仅限 /api/ 下且子域共享
• 中文或特殊字符必须先 encodeURIComponent() 编码，否则会被截断或解析失败
• 不要用 escape()，它已被废弃，encodeURIComponent() 才是标准

读取 document.cookie 返回的是原始字符串，没有内置解析方法

document.cookie 永远返回类似 "a=1; b=2; c=%E4%BD%A0%E5%A5%BD" 的拼接字符串，不会自动 decode 或结构化。手动提取时容易出错：

Article To Html

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

下载

• 用 .split("; ")（注意空格），不是 .split(";")，否则首尾空格会导致 pair[0].trim() 失效
• 推荐单值提取写法：document.cookie.split("; ").find(row => row.startsWith("theme="))?.split("=")[1]
• 拿到值后必须 decodeURIComponent()，否则中文显示为 %E4%BD%A0%E5%A5%BD
• 同一 key 出现多次时，find() 只取第一个，而浏览器实际生效的是最后一个——写入顺序影响读取结果

删除 Cookie 不是清空字符串，而是覆盖为过期时间

document.cookie = "theme=" 完全无效；删除的本质是用完全相同的 path 和 domain 设置一个已过期的同名 cookie：

• 正确删除：document.cookie = "theme=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
• 如果原 cookie 是 path=/settings/，删除时漏掉 path=/settings/，那 /settings/ 下的仍存在
• domain 必须严格一致：设的是 domain=.example.com，删的时候写成 domain=example.com 就不匹配
• 无法删除 HttpOnly cookie——它根本不出现在 document.cookie 返回值里

Secure 和 SameSite 属性在本地开发环境会静默失效

Secure 并非“加了就安全”，它只在 HTTPS 协议下生效；SameSite=Lax 在 IE 中完全不支持：

• document.cookie = "session=abc; Secure" 在 http://localhost 下不报错，但也不写入——查 Application > Cookies 面板为空
• 若用 http://127.0.0.1 替代 localhost，Secure 依然无效，只有 HTTPS 才触发
• SameSite=None 必须搭配 Secure，否则现代 Chrome 会拒绝设置
• 别依赖 SameSite 来“解决所有安全问题”——它防 CSRF，但不替代服务端鉴权和 HttpOnly

关键点在于：路径、域名、编码、过期时间这四者必须写入和删除时完全一致，差一个字符就可能残留或读不到。现代项目中，除登录态透传、CSRF token 等必须随请求发送的场景外，localStorage + 自定义过期逻辑更可控。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！