localStorage 不适合存储任何敏感数据，因其明文可读、易受XSS攻击；禁止存JWT、银行卡号、密钥、权限标识等；仅宜存深色模式、语言偏好等低风险UI配置；敏感数据应改用httpOnly Cookie、sessionStorage或后端下发。
根本上，localStorage 不适合存储任何敏感数据。它不是安全容器，而是浏览器中一个开放、明文、可被任意同源脚本读写的键值仓库。XSS 一旦发生，攻击者几行代码就能遍历、窃取、篡改甚至清空全部内容。所谓“加密后存 localStorage”并不能解决本质问题——密钥必然在前端运行时可见，解密逻辑可被 hook，HTTPS 和 CSP 缺失时，加密形同虚设。
明确哪些数据绝对不能进 localStorage
以下类型的数据，无论是否加密，都禁止存入 localStorage：
- 用户身份凭证：JWT token、session ID、refresh token
- 支付与身份信息：银行卡号、CVV、身份证号、护照号
- 密钥材料：API 密钥、AES 密钥、私钥、盐值（salt）
- 权限标识：isAdmin: true、role: "admin" 等易被前端伪造的字段
- 密码或口令明文/哈希（即使加盐）
真正该存什么？只存低风险、用户主动设置、需跨会话持久化的 UI 配置
localStorage 的合理用途非常有限，仅限于不影响系统安全、不涉及认证鉴权的纯前端状态：
- 深色模式开关（darkMode: true）
- 界面语言偏好（locale: "zh-CN"）
- 折叠面板展开状态（sidebarCollapsed: false）
- 自定义主题色（primaryColor: "#4a6fa5"）
- 表格列宽或排序（无需服务端校验）
这类数据即使被读取，也不会导致账户劫持或数据泄露；明文存储在 HTTPS + 严格 CSP 环境下已足够安全。
若必须存少量敏感配置，优先用替代方案而非硬刚 localStorage
与其在 localStorage 上做复杂加解密，不如从架构层面规避风险：
- 认证类 token → 改用 httpOnly + Secure Cookie：服务端签发，JS 无法读取，配合短时效、绑定 UA/IP、服务端二次校验
- 短期临时数据 → 用 sessionStorage：标签页关闭即销毁，天然降低泄露窗口期；可自行封装带时间戳和自动清理的 wrapper
- 环境或开关类配置 → 后端动态下发：通过 API 或首屏 JSON 注入，避免前端硬编码或本地持久化
- 调试/灰度标识 → 简单混淆即可：如键名倒序 + base64 编码值，不为防破解，只为避免一眼识别
如果非要用 localStorage 存结构化配置，必须守住四条底线
仅当满足全部条件时，才考虑对低敏配置做轻量处理：
- 全站强制 HTTPS，所有资源（JS/CSS/图片/API）均走 https 协议
- CSP 头禁用 unsafe-inline、unsafe-eval，script-src 仅允许可信域名 + SRI 校验
- 写入前过滤：用户输入必须白名单校验（如仅允许 "zh", "en", "dark", "light"）；避免存储 HTML/JS 字符串
- 读取后安全使用：绝不 eval()、绝不 innerHTML 赋值、绝不 setTimeout() 执行；用 JSON.parse() 解析，textContent 渲染文本
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
