PWA离线时应通过可信缓存维持身份状态,而非实时校验:安全存储短时效access_token与用户基础信息,禁止存敏感字段;离线启用“已登录但受限”模式,拦截需鉴权操作并降级UI;网络恢复后由Service Worker协同自动校验、同步及刷新token,所有敏感操作须服务端最终确认。

移动端 PWA 在离线状态下无法发起网络请求,因此传统的基于服务器的登录校验(如 JWT 验证、session 检查)会直接失败。但用户身份状态本身可以且应当在本地合理维持——关键不在于“实时校验”,而在于“可信缓存 + 安全降级 + 网络恢复后自动同步”。
本地身份状态的可信缓存
用户成功登录后,PWA 应将必要的身份凭证安全地持久化在客户端:
-
短期会话标识(如 access_token):可存入
localStorage或更安全的IndexedDB(避免 XSS 直接读取),同时设置明确的过期时间戳(非仅依赖服务端 TTL) - 用户基础信息(如 id、name、role):建议与 token 一同缓存,用于离线时渲染个性化界面(如顶部显示“欢迎,张三”)
- 避免存储敏感字段:如密码、refresh_token(除非使用 Web Crypto API 加密后存储)、完整 ID token(含签名部分)
离线时的身份感知与体验降级
没有网络时,应用不应强行跳转登录页或清空用户态,而应进入“已登录但受限”模式:
- 允许访问已缓存的页面(如首页、个人中心静态内容)、浏览本地 IndexedDB 中保存的历史数据(如草稿、离线表单)
- 对需鉴权的交互(如提交订单、修改密码)做明确拦截:显示“当前网络不可用,操作将在联网后自动执行”而非报错“未登录”
- 在 UI 上视觉弱化敏感操作区域(如置灰“支付”按钮),并提示“离线中,部分功能暂不可用”
网络恢复后的自动校验与同步
真正关键的校验动作发生在网络恢复瞬间,由 Service Worker 和主应用协同完成:
- Service Worker 拦截首次鉴权请求:当用户尝试触发受保护 API 时,fetch 事件先检查本地 token 是否有效(时间未过期 + 格式合法),再发起网络请求;若失败,则返回缓存的兜底响应(如 mock 的用户信息)
- Background Sync 自动补发待同步操作:用户离线期间提交的数据(如登录态刷新、表单提交)可存入 IndexedDB,并注册 sync 事件;联网后 SW 自动调用 API 完成校验与落库
-
主动 token 刷新机制:在页面可见(
document.visibilityState === 'visible')且网络恢复时,前端主动用 refresh_token(若安全存储)换取新 access_token,避免用户操作时才发现过期
安全边界必须守住
离线维持身份 ≠ 放弃安全原则:
- 所有敏感操作(尤其是写操作)必须在网络恢复后由服务端最终校验,客户端不能自行“认定有效”
- token 过期时间应设为较短(如 15–30 分钟),配合静默刷新,降低离线期间凭证泄露或被滥用的风险
- 用户主动退出、设备锁屏超时、或检测到 token 被远程吊销(通过定期 check-in 接口)时,必须立即清除本地凭证


















