安全还原本地存储JSON需先校验再解析:用safeParse函数检查字符串类型、非空,再try/catch解析,失败返回null;存储时必须JSON.stringify,读取后提供默认值兜底。

直接用 JSON.parse 解析本地存储(如 localStorage)中的字符串,看似简单,但一不留神就会报错甚至导致页面崩溃。关键在于:本地存储的值可能是 null、空字符串、非 JSON 格式字符串,或被篡改过的无效内容。安全还原的核心是「先校验,再解析」,而不是盲目调用。
检查值是否存在且为合法 JSON 字符串
从 localStorage 读取的值始终是字符串类型,但可能为 "null"、"",或根本不是 JSON(比如被手动编辑过)。不能只判断是否为真值。
- 先用
typeof value === 'string'确保是字符串 - 再用
value.trim() !== ''排除空白字符串 - 最后尝试解析,并用
try...catch捕获语法错误
封装一个健壮的 parse 工具函数
把校验和解析逻辑收拢成一个可复用函数,避免每次重复写 try/catch:
function safeParse(str) {
if (typeof str !== 'string' || !str.trim()) return null;
try {
const parsed = JSON.parse(str);
// 可选:进一步校验是否为对象或数组(按需)
if (parsed === null || (typeof parsed !== 'object')) return null;
return parsed;
} catch (e) {
return null;
}
}
使用示例:const data = safeParse(localStorage.getItem('userPrefs'));
返回值一定是解析后的对象/数组,或 null —— 不会抛错,也不返回意外类型。
存储时也需配合规范操作
安全解析的前提是存储本身可靠。务必用 JSON.stringify 存入,且避免存入 undefined、函数、Date、RegExp 等无法序列化的值:
使用约定式提交(Conventional Commits)生成标准化的 Git 提交信息。适用于以下场景: (1) 暂存更改时需要提交信息; (2) 审查 diff 时希望获得结构化摘要; (3) 编写 PR 描述或变更日志(changelog)条目; (4) 用户明确要求“为本次更改编写提交信息”。 该功能会分析已暂存/未暂存的 diff,并生成按类型(type)划分范围的提交信息。
- 存前过滤:例如
localStorage.setItem('cart', JSON.stringify(cartItems || [])) - 避免直接存
localStorage.setItem('config', someObj)(未 stringify) - 若需存日期等特殊类型,先转成字符串(如
date.toISOString()),读取时再恢复
对 null 或解析失败做明确兜底
不要让解析失败导致后续逻辑中断。根据业务场景提供默认值:
- 数组默认值:
const list = safeParse(localStorage.getItem('tasks')) || [] - 对象默认值:
const config = safeParse(localStorage.getItem('settings')) || { theme: 'light' } - 需要区分“无数据”和“解析失败”时,可用
undefined表示前者,null表示后者
不复杂但容易忽略:JSON 安全还原不是靠一次 parse,而是靠前置判断 + 异常捕获 + 合理默认。写好 safeParse,后面所有本地存储读取都稳了。









