Win10火狐78.15.0esr返回主页标签后session storage被清除如何解决？

开发者阿泽

2026-9-29

解决方案

问题根因

该问题属于Windows 10平台下Firefox 78.15.0esr版本的特定bug：当新标签页默认设置为主页时，用户从应用页面回退到主页后，浏览器会错误销毁同标签页下前向历史条目的sessionStorage上下文，导致前进回到应用时会话数据丢失。

最优适配方案

该方案完全不改动现有业务逻辑，也不需要替换sessionStorage实现，同时满足单标签页独立会话的需求：

步骤1：仅针对命中bug的浏览器环境做兼容逻辑，不影响其他正常浏览器运行
先做环境判断：
```
const isBuggyFirefox = /Windows NT 10/.test(navigator.userAgent) && /Firefox\/78\.15\.0esr/.test(navigator.userAgent)
```

步骤2：存储sessionStorage时同步备份到history.state
history.state和当前标签页的历史条目绑定，不同标签页不共享，完全符合业务要求的单标签会话隔离规则，且不会被该bug清空：

// 封装存储方法，替换原有sessionStorage.setItem调用
function saveSessionItem(key, value) {
  sessionStorage.setItem(key, value);
  if (!isBuggyFirefox) return;
  const currentState = history.state || {};
  const backup = currentState._sessionBackup || {};
  backup[key] = value;
  history.replaceState({ ...currentState, _sessionBackup: backup }, document.title);
}

步骤3：页面加载时自动恢复丢失的sessionStorage数据

window.addEventListener('load', () => {
  if (!isBuggyFirefox) return;
  // 仅当sessionStorage为空且存在备份时执行恢复
  if (sessionStorage.length === 0 && history.state?._sessionBackup) {
    Object.entries(history.state._sessionBackup).forEach(([key, value]) => {
      sessionStorage.setItem(key, value);
    });
  }
});