iOS14系统中运行的PWA如何使用浏览器发起的会话

核心原因 #

iOS 14.x 版本中，苹果对添加到主屏幕独立运行的PWA应用与系统内置Safari浏览器采用了完全隔离的存储沙箱机制，二者的Cookie、LocalStorage、SessionStorage、Service Worker缓存等数据完全不互通，和安卓端Chrome将PWA与主浏览器共享存储池的逻辑存在本质差异。
此外iOS 14.2针对跨域跳转的会话Cookie额外加强了ITP（智能跟踪预防）限制，从Safari登录后重定向回PWA时，默认不会携带跨域生成的会话Cookie，直接导致PWA识别不到已登录的会话状态。

可行解决方案 #

• 方案1：调整登录交互逻辑，不唤起外置Safari，改为在PWA内部通过iframe内嵌登录表单，和PWA本身上下文共享存储空间，登录生成的会话数据可直接被PWA读取。需要注意调整登录页的X-Frame-Options响应头，允许PWA所属域名的嵌入请求。
• 方案2：登录成功后重定向回PWA首页时，将会话凭证（如Token、Session ID）作为URL参数拼接在PWA首页地址后，PWA启动后主动读取URL参数中的凭证，存入自身上下文的LocalStorage/ SessionStorage中，后续业务请求主动携带该凭证即可。注意需要做好参数的有效期校验，降低凭证泄露风险。
• 方案3：配置会话Cookie的SameSite=None + Secure属性，同时确保登录域名和PWA域名在苹果ITP的可信任域名列表中。该方案仅适配iOS 14.3及以上版本，14.2版本存在已知的SameSite属性识别Bug，兼容性较差。

适配建议 #

若你的业务用户群体中iOS 14.2版本占比较高，建议优先选用方案2的URL传参方式，是当前兼容性最高的适配方案。

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