Firebase 多个 "apps" - 客户端和服务器端

Question

所以，我想在项目中添加另一个 firebase 应用程序。我已经有一个用于 SSR (firebase-admin)，因此服务器可以预渲染网站。现在我想添加 firebase@8，这样我就可以开始在客户端使用它，然后再对其应用 firestore 规则。问题是，当我尝试使用它时出现此错误：

/node_modules/@google-cloud/storage/build/src/bucket.js:22:0
Module not found: Can't resolve 'fs'

Import trace for requested module:
./node_modules/@google-cloud/storage/build/src/index.js
./node_modules/firebase-admin/lib/storage/storage.js
./node_modules/firebase-admin/lib/app/firebase-namespace.js
./node_modules/firebase-admin/lib/default-namespace.js
./node_modules/firebase-admin/lib/index.js
./firebase/config.js
./firebase/createDocument.js
./components/form/Form.js
./pages/opinia/index.js

https://nextjs.org/docs/messages/module-not-found

这是我的配置文件：

import * as admin from 'firebase-admin';
import firebase from 'firebase';
import 'firebase/firestore';

// initialize firebase on CLIENT
const firebaseConfig = {
  apiKey: process.env.FIREBASE_KEY,
  authDomain: process.env.FIREBASE_DOMAIN,
  projectId: process.env.FIREBASE_ID,
  storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID,
  appId: process.env.APP_ID,
};

export const clientApp = initializeApp(firebaseConfig);

// firestore
export const projectFirestoreClient = firebase.firestore(clientApp);

// timestamp
export const timestampClient = firebase.firestore.Timestamp;

// initialize firebase on SERVER
if (!admin.apps.length) {
  const serviceAccount = require('./firebase-adminsdk.json');

  admin.initializeApp({
    credential: admin.credential.cert(serviceAccount),
  });
}

// firestore
export const projectFirestoreAdmin = admin.firestore();

// timestamp
export const timestampAdmin = admin.firestore.Timestamp;

所以，我的问题是，我该如何解决这个错误？是什么原因造成的？提前致谢。

Answer 1

Firebase Admin 不适用于客户端。当您运行应用程序时，Firebase Admin 也会被导入并导致该错误。理想情况下，您应该在另一个只能在服务器端访问的文件中初始化 Firebase Admin。

查看 this blog 以了解有关如何将 Firebase Admin 与 NextJS 结合使用的分步说明。

Firebase 多个 "apps" - 客户端和服务器端

Firebase multiple "apps" - client side and server side

javascript

firebase

reactjs

firebase-admin

next.js