火狐隐私窗口遇IndexedDB错误，如何跳过该模块保障系统运行？

错误原因 #

火狐浏览器隐私窗口默认限制IndexedDB的写入/突变操作，触发InvalidStateError，未捕获的Promise错误会导致页面崩溃。

具体解决步骤 #

1. 提前检测IndexedDB可用性 #

在初始化IndexedDB模块前，先做简单检测，判断当前环境是否允许正常操作：

async function isIndexedDBAvailable() {
  try {
    const request = indexedDB.open('test-db', 1);
    await new Promise((resolve, reject) => {
      request.onsuccess = resolve;
      request.onerror = reject;
      request.onupgradeneeded = (e) => e.target.result.close(); // 关闭临时创建的数据库
    });
    return true;
  } catch (err) {
    // 匹配InvalidStateError，判定为隐私模式限制
    if (err.name === 'InvalidStateError') {
      return false;
    }
    // 其他错误可根据情况处理
    throw err;
  }
}

2. 全局捕获未处理的Promise错误 #

防止未捕获的Promise错误导致页面崩溃，全局监听错误并过滤该类错误：

window.addEventListener('unhandledrejection', (event) => {
  const err = event.reason;
  // 匹配IndexedDB的InvalidStateError，阻止默认崩溃行为
  if (err && err.name === 'InvalidStateError' && err.message.includes('IndexedDB')) {
    event.preventDefault();
    console.warn('IndexedDB在当前环境不可用，已跳过相关模块');
  }
});

3. 封装IndexedDB操作的错误处理 #

将所有IndexedDB相关操作统一封装，一旦触发目标错误，自动切换到备用逻辑（比如内存存储）：

class StorageManager {
  constructor() {
    this.useIndexedDB = true;
    this.memoryStorage = new Map();
    this.init();
  }

  async init() {
    this.useIndexedDB = await isIndexedDBAvailable().catch(() => false);
    if (!this.useIndexedDB) {
      console.warn('切换到内存存储模式');
    }
  }

  async setItem(key, value) {
    if (!this.useIndexedDB) {
      return this.memoryStorage.set(key, value);
    }
    try {
      // 原IndexedDB写入逻辑
      const db = await this.getDB();
      const tx = db.transaction('store', 'readwrite');
      const store = tx.objectStore('store');
      await store.put(value, key);
      await tx.complete;
    } catch (err) {
      if (err.name === 'InvalidStateError') {
        this.useIndexedDB = false;
        return this.memoryStorage.set(key, value);
      }
      throw err;
    }
  }

  // 其他getItem、removeItem等方法同理，都加错误处理
}

4. 业务逻辑中跳过IndexedDB模块 #

在系统初始化时，根据isIndexedDBAvailable()的结果，决定是否加载/执行IndexedDB相关逻辑：

async function initApp() {
  const dbAvailable = await isIndexedDBAvailable();
  if (dbAvailable) {
    // 正常初始化IndexedDB模块
    initIndexedDBModule();
  } else {
    // 跳过IndexedDB，初始化备用逻辑
    initFallbackStorage();
  }
  // 初始化系统其他模块，不受影响
  initOtherModules();
}

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