在同一 JavaScript 应用中合并多个 Firebase 项目_技术教程

本文档旨在指导开发者如何在单个 JavaScript 应用程序中集成并管理多个 Firebase 项目。通过为每个 Firebase 应用实例分配唯一的名称，您可以同时访问和操作来自不同 Firebase 项目的数据和服务，从而实现更灵活和强大的应用架构。本文将提供详细的代码示例和配置说明，帮助您顺利完成多项目集成。

集成多个 Firebase 项目

在某些场景下，您可能需要在一个应用程序中管理多个 Firebase 项目。例如，您可能有一个用于管理后台的 Firebase 项目和一个用于客户端应用的 Firebase 项目。为了实现这一点，您需要在初始化 Firebase 应用时为每个项目指定一个唯一的名称。

初始化 Firebase 应用

首先，您需要为每个 Firebase 项目创建对应的配置对象。这些配置对象包含连接到 Firebase 项目所需的凭据，例如 API 密钥、认证域名、项目 ID 等。

const firebaseConfigAdmin = {
  apiKey: "AIzaSy...",
  authDomain: "admin-side.firebaseapp.com",
  projectId: "admin-side",
  storageBucket: "admin-side.appspot.com",
  messagingSenderId: "5434...",
  appId: "1:543...:web:aa001...",
};

const firebaseConfigClient = {
  apiKey: "AIzaSyB...",
  authDomain: "client-side.firebaseapp.com",
  projectId: "client-side",
  storageBucket: "client-side.appspot.com",
  messagingSenderId: "74150...",
  appId: "1:741...:web:7614...",
};

接下来，使用 initializeApp 函数初始化每个 Firebase 应用。关键在于为每个应用提供一个唯一的名称作为第二个参数。这确保了每个应用实例可以被独立访问和管理。

import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore/lite";
import { getStorage } from "firebase/storage";

// 初始化 admin Firebase 项目
const adminApp = initializeApp(firebaseConfigAdmin, "admin");
const adminDb = getFirestore(adminApp);
const adminStorage = getStorage(adminApp);

// 初始化 client Firebase 项目
const clientApp = initializeApp(firebaseConfigClient, "client");
const clientDb = getFirestore(clientApp);
const clientStorage = getStorage(clientApp);

export { adminDb, adminStorage, clientDb, clientStorage };

在这个例子中，我们分别初始化了名为 "admin" 和 "client" 的两个 Firebase 应用。我们还获取了每个应用的 Firestore 和 Storage 实例，并将它们导出以便在应用程序的其他部分使用。

访问不同 Firebase 项目的数据

现在，您可以根据需要访问和操作来自不同 Firebase 项目的数据。例如，您可以从 admin 项目的 Firestore 中读取数据，并将数据写入 client 项目的 Firestore 中。

import { adminDb, clientDb } from "../firebase";
import { collection, getDocs, addDoc } from "firebase/firestore/lite";

async function fetchDataAndWriteToClient() {
  // 从 admin 项目的 "blogPosts" 集合中获取数据
  const adminCollectionRef = collection(adminDb, "blogPosts");
  const adminSnapshot = await getDocs(adminCollectionRef);
  const adminData = adminSnapshot.docs.map((doc) => ({
    ...doc.data(),
    id: doc.id,
  }));

  // 将数据写入 client 项目的 "posts" 集合中
  const clientCollectionRef = collection(clientDb, "posts");
  for (const item of adminData) {
    await addDoc(clientCollectionRef, item);
  }

  console.log("Data successfully transferred to client project!");
}

fetchDataAndWriteToClient();

在这个例子中，我们首先从 admin 项目的 "blogPosts" 集合中获取所有文档。然后，我们将这些文档写入 client 项目的 "posts" 集合中。