做这个项目的起因是市面上的学习类工具都把内容和账号数据放在服务端,用户无法真正拥有自己的学习记录,长期订阅成本也高。目标是做一个本地优先的学习系统:课程内容与学习进度都存在用户自己的浏览器里,离线可用,只用一个轻量鉴权网关控制访问权限。面向的是需要长期系统学习、又在意数据自主的用户。
点击空白处退出提示
做这个项目的起因是市面上的学习类工具都把内容和账号数据放在服务端,用户无法真正拥有自己的学习记录,长期订阅成本也高。目标是做一个本地优先的学习系统:课程内容与学习进度都存在用户自己的浏览器里,离线可用,只用一个轻量鉴权网关控制访问权限。面向的是需要长期系统学习、又在意数据自主的用户。
系统包含五个核心模块。一是课程内容体系,共 83 门课程,分主单元与复盘单元两类,每门课含原文提取、讲解、参考、练习与迁移任务。二是本地数据库层,基于 IndexedDB 存储全部学习记录与配置,支持多账号隔离。三是增量更新机制,通过 Service Worker 缓存并做版本握手,避免更新后白屏。四是鉴权网关,用边缘函数做口令校验与响应头标记,区分放行与拦截两种状态。五是导出备份,学习数据可整体导出为文件,换设备可恢复。
独立完成从需求梳理到上线部署的全部环节。技术栈是原生 JavaScript + IndexedDB + Service Worker + 边缘函数。难点在更新安全:浏览器缓存、Service Worker 缓存和边缘缓存三层叠加,改一版内容常出现脚本哈希不匹配,入口被内容安全策略拦截而白屏。解决办法是构建时统一换行符、给每个资源算内容哈希,并在 HTML 里放一个纯 CSS 的启动兜底块,八秒内没渲染出内容就提示重试。



评论