连接Firebase本地模拟器遇Service storage不可用错误求助

1. 确认Storage模拟器已正确启动 #

• 运行firebase emulators:start后，检查终端输出是否包含 "Storage Emulator running at http://localhost:9199"，如果没有：
  • 打开项目根目录的firebase.json，确保添加Storage模拟器配置：

    {
      "emulators": {
        "storage": {
          "port": 9199
        }
      }
    }
    

  • 重新启动模拟器

2. 统一Firebase依赖版本 #

• 检查package.json中所有firebase相关包（firebase/auth、firebase/firestore、firebase/storage等）的版本是否一致，版本不匹配是常见诱因
• 执行npm list firebase查看版本树，若存在版本差异：
  • 卸载现有firebase包：npm uninstall firebase
  • 重新安装最新版：npm install firebase@latest

3. 验证本地Storage Bucket配置 #

• 本地模拟器对storageBucket的要求极低，但不能为空值
• 检查环境变量REACT_APP_DEMOSTORAGEBUCKET是否已正确设置（可在控制台打印process.env.REACT_APP_DEMOSTORAGEBUCKET确认）
• 临时硬编码测试：将初始化代码中的storageBucket改为"demo-bucket"，排除环境变量为空的问题

4. 彻底清理npm依赖缓存 #

• 执行以下命令彻底重置依赖：

  npm cache clean --force
  rm -rf node_modules package-lock.json
  npm install
  

• 此操作会完全重新拉取依赖，解决潜在的缓存或依赖树损坏问题

5. 检查模拟器连接逻辑 #

• 确认代码中hostname === "localhost"的判断是否生效（可在控制台打印window.location.hostname验证）
• 确保connectStorageEmulator调用时，storage实例已正确初始化（代码中当前顺序是对的，但可尝试将连接逻辑放在getStorage(app)之后立即执行）

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