无法连接到 Next.js 中的 Firestore 模拟器

Question

我正在使用 Firebase 和 Next.js 创建一个网络应用。我在客户端使用了身份验证和 RTDB 没有任何问题，但是当我尝试使用 Cloud Firestore 时，它​​在浏览器的控制台中引发错误，说客户端离线或我的设备没有正常连接 em>.

我尝试通过实时服务器和其他本地服务器连接到 Firestore 模拟器，它运行良好，没有任何错误，但它在 Next.js 中无法运行。

我还在我的客户端应用中实现了这个逻辑，以防止在服务器端使用模拟器。 https://stackoverflow.com/a/66567745/7588591

import firebase from 'firebase/app'
import 'firebase/auth'
import 'firebase/firestore'
import 'firebase/database'

const clientCredentials = {
  apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
  authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.NEXT_PUBLIC_FIREBASE_DATABASE_URL,
  projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
  storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID,
  appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID
}

if (!firebase.apps.length) {
  firebase.initializeApp(clientCredentials)
  // Check that `window` is in scope for the analytics module!
  if (typeof window !== 'undefined' && 'measurementId' in clientCredentials) {
    firebase.analytics()
    firebase.performance()
  }
}

const firestore = firebase.firestore()
const auth = firebase.auth()
const database = firebase.database()

if (process.env.NODE_ENV === 'development') {
  if (typeof window === 'undefined' || !window['_init']) {
    firestore.useEmulator('localhost', 8085)
    database.useEmulator('localhost', 9000)
    if (typeof window !== 'undefined') window['_init'] = true
  }

  auth.useEmulator('http://localhost:9099', {
    disableWarnings: true
  })
}

export default firebase
export { firebase, firestore, auth, database }

这是我用来向我的客户端应用公开 Firestore、身份验证和 RTDB 实例的代码。身份验证和 RTDB 实例工作正常，但只有 Firestore 出现错误。 我试图在组件加载时获取 useEffect 钩子内的数据，以确保代码在客户端运行。