如何用Javascript连接原生模式Firestore？配置信息及示例求助

我之前刚碰到过和你一模一样的问题，当时查了好多资料才搞明白，给你梳理下解决方案：

一、先搞定配置信息的获取 #

原生模式的Firestore其实还是和Firebase项目绑定的，你要找的authDomain、databaseURL这些配置，得去Firebase控制台（不是GCP控制台的Firestore单独页面）拿，步骤很简单：

• 打开Firebase控制台，找到你关联了原生模式Firestore的项目（和GCP里的项目是同一个）
• 点击左侧的齿轮图标，选择「项目设置」
• 往下滑到「你的应用」区域：
  • 如果还没添加过Web应用，点击「添加应用」→ 选Web平台（那个</>图标），跟着向导走完，就能看到完整的配置代码块，所有你要的字段都在里面
  • 如果已经有Web应用了，直接找到对应的应用，点击「配置」就能调出这些信息

二、JS对接原生模式Firestore的示例代码 #

其实谷歌文档没专门做区分是因为：Firebase JS SDK会自动识别你的Firestore是原生模式还是Datastore模式，只要配置正确，代码写法和Firebase集成版的Firestore几乎完全一样。这里给你两个版本的示例：

传统命名空间版本（适合用CDN的场景） #

// 先在HTML里引入Firebase SDK（版本可以选最新的）
// <script src="https://www.gstatic.com/firebasejs/9.23.0/firebase-app.js"></script>
// <script src="https://www.gstatic.com/firebasejs/9.23.0/firebase-firestore.js"></script>

// 用从Firebase控制台拿到的配置初始化
const firebaseConfig = {
  apiKey: "你的apiKey",
  authDomain: "你的authDomain",
  databaseURL: "你的databaseURL",
  projectId: "你的GCP项目ID",
  storageBucket: "你的storageBucket",
  messagingSenderId: "你的messagingSenderId",
  appId: "你的appId" // 可选，但控制台会提供，加上也没问题
};

// 初始化Firebase应用
firebase.initializeApp(firebaseConfig);

// 获取Firestore实例
const db = firebase.firestore();

// 测试读取一个文档（替换成你的集合和文档ID）
db.collection("products").doc("item001").get()
  .then((doc) => {
    if (doc.exists) {
      console.log("文档内容:", doc.data());
    } else {
      console.log("未找到该文档");
    }
  })
  .catch((err) => {
    console.error("读取文档出错:", err);
  });

模块化版本（适合npm安装的现代项目） #

// 先安装依赖：npm install firebase
import { initializeApp } from "firebase/app";
import { getFirestore, doc, getDoc } from "firebase/firestore";

const firebaseConfig = {
  // 你的配置信息
};

// 初始化应用和Firestore
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

// 异步读取文档示例
async function getProductDoc() {
  const docRef = doc(db, "products", "item001");
  const docSnap = await getDoc(docRef);
  
  if (docSnap.exists()) {
    console.log("文档数据:", docSnap.data());
  } else {
    console.log("文档不存在");
  }
}

// 调用测试
getProductDoc();

三、额外提醒 #

• 不需要为原生模式做任何特殊配置，SDK会自动适配，你之前用模拟器的Python代码能跑，说明项目权限没问题，JS这边只要配置对了就能正常用
• 如果碰到权限问题，记得去GCP控制台的Firestore「规则」页面检查，确保你的Web应用有对应的读写权限

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