localstorage可在音乐播放器中持久保存收藏夹和播放列表，通过结构化存储（json字符串）、及时同步、安全解析（try...catch+兜底）、跨标签页监听storage事件及适时清理来实现稳定体验。
LocalStorage 可以在音乐播放器中持久保存用户的收藏夹和播放列表，无需后端就能实现“关掉页面再打开还在”的体验。关键在于结构化存储、及时同步、避免覆盖，并处理好数据变更时的更新逻辑。
用清晰结构存收藏夹与播放列表
不要直接存原始对象或数组，而是用统一键名 + JSON 字符串格式：
-
收藏夹：用
localStorage.setItem('music_favorites', JSON.stringify(songArray))，其中songArray是包含id、title、artist、coverUrl等字段的对象数组 -
播放列表：比如用户自建的“晨跑歌单”，可用
localStorage.setItem('playlist_morning_run', JSON.stringify(trackIds))，只存歌曲 ID 数组更轻量；也可存完整信息，视需求而定 - 推荐为每个播放列表分配唯一 ID（如 UUID 或时间戳+名称哈希），避免命名冲突
读取时做安全解析与兜底处理
LocalStorage 只支持字符串，读取后必须 JSON.parse，且要防报错：
Javascript Sdk
下载
用于 inference.sh 的 JavaScript/TypeScript SDK，可运行 AI 应用、构建代理、集成 150+ 模型。包名：@inferencesh/sdk（npm install），完整 TypeScript 支持。
- 用
try...catch包裹解析过程，防止数据损坏导致整个功能异常 - 读取不到或解析失败时，返回空数组
[]或默认播放列表，不中断 UI 渲染 - 示例： const favorites = JSON.parse(localStorage.getItem('music_favorites') || '[]') || [];
增删改操作后立即写入，避免丢失
每次用户点击“收藏”、“移除”、“添加到歌单”、“调整顺序”后，都要重新序列化并写入 LocalStorage：
- 添加一首歌到收藏夹：
favorites.push(newSong)→localStorage.setItem(...) - 从播放列表删除某首：
playlist = playlist.filter(id => id !== targetId)→ 再保存 - 拖拽排序后更新数组顺序，再保存——顺序信息只存在于前端数组里，不写入就丢了
- 避免高频写入（如进度条拖动时不停存），收藏/列表类操作本身频次低，可放心每次更新都写
跨标签页同步需要额外监听
LocalStorage 修改不会自动通知同域其他标签页，用户在 A 标签页收藏了歌，B 标签页的收藏夹仍显示旧数据：
- 监听
storage事件：window.addEventListener('storage', e => { if (e.key === 'music_favorites') loadFavorites(); }) - 注意：该事件只在其他标签页触发修改时才在当前页收到，自身修改不触发
- 适合用于实时刷新侧边栏收藏数量、播放列表内容等，提升多窗口体验
不复杂但容易忽略：记得在清除缓存或退出登录时主动调用 localStorage.removeItem() 或 clear()，避免残留旧用户数据。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
