尝试使用 Firestore 时，Firebase 模拟器出现 CORS 错误

Question

我已将模拟器设置为可以工作，我可以在端口 4000 上访问它。我还看到 Firestore 状态为“ON”

但是，当我尝试进行查询时，我得到：

Access to fetch at 'http://localhost:8080/google.firestore.v1.Firestore/Listen/channel?database=projects%2Ffresh-divot%2Fdatabases%2F(default)&VER=8&RID=14788&CVER=22&X-HTTP-Session-Id=gsessionid&%24httpHeaders=X-Goog-Api-Client%3Agl-js%2F%20fire%2F9.6.6%0D%0AContent-Type%3Atext%2Fplain%0D%0A&zx=6jc2pop1rvwd&t=1' from origin 'http://localhost:1234' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.

我的设置如下：react web app running on localhost:1234 我的模拟器 firestore running on localhost:8088

我的设置如下：

let config = {
  apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
  authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
  storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_TO,
  appId: process.env.REACT_APP_FIREBASE_APP_ID,
  databaseURL: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
};

if (location.hostname === "localhost") {
  config = {
    databaseURL: "http://localhost:8088?ns=emulatorui",
    projectId: "demo-test",
    apiKey: "random-string-without-apikey-i-get-error",
  };
}

const app = initializeApp(config);
export const auth = getAuth();

// Functions
const functions = getFunctions();
const fdb = getFirestore();

if (location.hostname === "localhost") {
  connectFunctionsEmulator(functions, "localhost", "5001");
  connectAuthEmulator(auth, "http://localhost:9099");
  connectFirestoreEmulator(fdb, "localhost", 8080);
}

有人能指出我如何解决这个问题吗？在线教程似乎都没有这个问题，所以感觉我错过了一些明显的东西。

Answer 1

试试这个吧...

initializeApp(config)
// add after initializeApp
const db = getFirestore()
connectFirestoreEmulator(db, 'localhost', 8090)

...其中 8090 是您的 Firestore 端口