英文:
How to reuse the next-auth initFirestore object to also fetch some data from Firestore
问题
我已设置一个 NextJS v13.4.2 项目,使用 next-auth v4.22.1,以便用户可以通过“使用Google登录”按钮进行身份验证。我目前还在使用 next-auth Firebase 适配器。当前文件配置如下:
/app/(lib)/firestore.js
:
import { initFirestore } from "@next-auth/firebase-adapter";
import { cert } from "firebase-admin/app";
export const firestore = initFirestore({
credential: cert({
projectId: process.env.FIREBASE_PROJECT_ID,
clientEmail: process.env.FIREBASE_CLIENT_EMAIL,
privateKey: process.env.FIREBASE_PRIVATE_KEY,
}),
});
/app/(lib)/auth.js
:
import GoogleProvider from "next-auth/providers/google";
import { FirestoreAdapter } from "@next-auth/firebase-adapter";
import { firestore } from "@lib/firestore";
export const authOptions = {
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_ID,
clientSecret: process.env.GOOGLE_SECRET,
}),
],
adapter: FirestoreAdapter(firestore),
};
/app/api/auth/[...nextauth]/route.js
:
import NextAuth from "next-auth";
import { authOptions } from "@lib/auth";
const handler = NextAuth(authOptions);
export { handler as GET, handler as POST };
现在,所有这些都运行正常,但我想要做的是从我的 Firestore 数据库中查询一些数据并将其显示在页面上。所以,我认为可以通过以下方式实现:
import { firestore } from "@lib/firestore";
import { collection, getDocs } from "firebase/firestore";
const citiesCol = collection(firestore, "cities");
const citiesSnapshot = await getDocs(citiesCol);
const citiesList = citiesSnapshot.docs.map((doc) => doc.data());
但不幸的是,我收到了错误消息:“Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore”
所以,我的问题是,我可以重用(从 /app/(lib)/firestore.js
导出的)firestore
对象来处理 next-auth 逻辑并获取一些数据吗?还是我需要创建一个不同的 firebase 配置 并重新初始化 Firestore?
英文:
I've set up a NextJS v13.4.2 project with next-auth v4.22.1 to let users authenticate by using the 'Login with Google' button. I'm also currently using the next-auth Firebase adapter. The current files configs are:
/app/(lib)/firestore.js
:
import { initFirestore } from "@next-auth/firebase-adapter";
import { cert } from "firebase-admin/app";
export const firestore = initFirestore({
credential: cert({
projectId: process.env.FIREBASE_PROJECT_ID,
clientEmail: process.env.FIREBASE_CLIENT_EMAIL,
privateKey: process.env.FIREBASE_PRIVATE_KEY,
}),
});
/app/(lib)/auth.js
:
import GoogleProvider from "next-auth/providers/google";
import { FirestoreAdapter } from "@next-auth/firebase-adapter";
import { firestore } from "@lib/firestore";
export const authOptions = {
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_ID,
clientSecret: process.env.GOOGLE_SECRET,
}),
],
adapter: FirestoreAdapter(firestore),
};
/app/api/auth/[...nextauth]/route.js
:
import NextAuth from "next-auth";
import { authOptions } from "@lib/auth";
const handler = NextAuth(authOptions);
export { handler as GET, handler as POST };
Now, all of this works fine, but what I would like to do is to also query some data from my Firestore db and displaying it into a page. So, I thought I could do that by doing:
import { firestore } from "@lib/firestore";
import { collection, getDocs } from "firebase/firestore";
const citiesCol = collection(firestore, "cities");
const citiesSnapshot = await getDocs(citiesCol);
const citiesList = citiesSnapshot.docs.map((doc) => doc.data());
But sadly I get the error: Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore
So, my question is, can I reuse the firestore
object (from /app/(lib)/firestore.js
) that I'm exporting for handling the next-auth logics to also fetch some data? Or do I need to create a different firebase config and initialize Firestore again?
答案1
得分: 0
Posting this as a community wiki for visibility.
According to @samthecodingman:
> @next-auth/firebase-adapter
是一个服务器端包,用于与 firebase-admin
一起使用。
您可以通过此链接查看示例。
您还可以查看此链接,了解如何将 Firebase 添加到您的 JavaScript 项目中2。
英文:
Posting this as a community wiki for visibility.
According to @samthecodingman:
> @next-auth/firebase-adapter
is a server-side package and this is meant to use with firebase-admin
.
You may check an example through this link.
You may also want to follow this link on how to add Firebase to your JavaScript project.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论