g.8操作⏱ 约 5 分钟

数据持久化

让数据"刷新也不丢"

🔎 最后验证 2026-05📚 来源:通用计算机常识、《AI编程实战三卷书》卷二🧰 Claude Code✅ 47 人学过👁 75 次阅读

为什么学这个

你的项目现在能用,但一刷新页面,数据全没了——因为它只活在内存里。要让它像个真正的产品,得把数据存下来,关了再开还在。这一步叫持久化,也是项目从"演示"走向"能用"的关键一跃。

💡 打个比方

没持久化的数据像写在白板上:看着在,一擦(刷新)就没。持久化就是把它抄进笔记本(本地存储或数据库)——下次翻开还在。产品和玩具的一个区别,就是"东西留不留得住"。

几种常见的持久化方式(按项目复杂度选):
- 浏览器本地存储(localStorage):最简单,适合纯前端小项目。但要清楚它的边界——只存在"这一台设备、这一个浏览器"里,清缓存/无痕模式/换设备都会丢,还有容量上限(约 5-10MB)。它不是产品级存储;要多端同步、多用户共享、可靠保存,得用后端数据库。
- 数据库:多用户、要在服务器统一存取时用(P2 4.9 的数据库登场)
- 文件:简单脚本类项目,直接读写文件
和 AI 一起加持久化时,把 P4 的安全意识带上:
- ⚠️ 前端(浏览器里)的存储一律视为"公开可见":localStorage 里的任何东西,用户本人和页面上任意脚本都能看到——所以密钥、令牌(token)、第三方密码这类敏感数据绝不能放前端,必须走后端(P4 #5)
- 数据库操作注意不加条件的 UPDATE/DELETE 会误伤一片(P2 4.10 / P4 #6)
加完务必验证:

都看到这了，打个赏呗！