iOS 11.3 PWA启动时清除登录令牌问题求助

我之前帮不少开发者排查过iOS 11.3 PWA的这个状态丢失问题——这个版本的Safari确实存在PWA存储上下文的兼容性bug，导致从主屏幕启动时会重置会话状态，丢失登录凭证。不过有几个经过验证的可行方案，你可以试试：

1. 优先使用持久化存储替代会话存储 #

iOS 11.3的PWA主屏幕启动时，sessionStorage和内存中的状态会被完全清除，但localStorage和IndexedDB的持久化存储是可以保留的。所以你需要：

• 登录成功后，把登录凭证（比如JWT token、用户ID）存入localStorage，而不是仅存在内存或sessionStorage中：

  // 登录成功后保存凭证
  localStorage.setItem('authToken', 'your-jwt-token-here');
  localStorage.setItem('userId', 'user-123');
  

• 应用启动时（比如DOMContentLoaded事件触发时），先读取localStorage中的凭证，自动恢复登录状态：

  document.addEventListener('DOMContentLoaded', () => {
    const authToken = localStorage.getItem('authToken');
    if (authToken) {
      // 调用接口验证token有效性，恢复登录状态
      restoreUserSession(authToken);
    }
  });
  

2. 配置持久化Cookie（如果用Cookie存凭证） #

如果你使用Cookie管理登录状态，要确保设置持久化Cookie属性，避免使用会话Cookie：

• 设置max-age或expires属性，让Cookie在指定时间内保持有效：

  Set-Cookie: authToken=your-token; Max-Age=2592000; Secure; HttpOnly; SameSite=Lax
  

  这里Max-Age=2592000代表30天有效期，同时加上Secure（仅HTTPS传输）和HttpOnly（防止XSS窃取）提升安全性。

3. 确保Web App Manifest配置正确 #

iOS 11.3对PWA的scope属性比较敏感，如果配置不当，可能导致启动时进入不同的存储上下文：

• 在manifest.json中明确设置scope为应用根路径，确保所有页面共享同一个存储容器：

  {
    "name": "你的PWA应用",
    "short_name": "PWA应用",
    "display": "standalone",
    "scope": "/",
    "start_url": "/"
  }
  

  同时确认display设置为standalone或fullscreen，这是iOS 11.3支持的PWA启动模式。

4. 避免依赖服务工作者的临时缓存 #

如果你的应用使用了Service Worker，不要把登录状态相关的逻辑依赖于Service Worker的临时缓存——iOS 11.3的Service Worker缓存可能会在应用重启时被清理。确保登录凭证的存储完全独立于Service Worker的缓存机制。

需要注意的是，iOS 11.3的PWA支持度相对有限，这些方案都是基于实际开发中的验证总结出来的，你可以先测试localStorage的方案，这是最直接有效的。

内容的提问来源于stack exchange，提问作者Riley Davidson