Next.js Netflix克隆项目调用getProducts()遇FirebaseError求助

这个报错的核心原因是@stripe/firestore-stripe-payments内部调用Firestore的collection()方法时，传入了无效的引用对象，大概率是payments实例初始化错误或依赖转译导致的兼容性问题，以下是针对性排查步骤：

1. 验证Payments实例初始化逻辑 #

确保你用正确的Firestore实例初始化createStripePayments，而非FirebaseApp或未初始化的对象，示例代码如下：

import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import { createStripePayments } from "@stripe/firestore-stripe-payments";

// 初始化Firebase App
const firebaseApp = initializeApp({ /* 你的Firebase配置 */ });

// 必须传入getFirestore返回的实例，不能直接传FirebaseApp
const firestore = getFirestore(firebaseApp);

// 初始化Stripe Payments，集合名要和Firestore中实际的集合完全一致
const payments = createStripePayments({
  firestore,
  productsCollection: "products",
  customersCollection: "customers",
});

2. 排查转译包导致的异常 #

如果你之前为@stripe/firestore-stripe-payments做过转译配置（比如Next.js的transpilePackages），可能破坏了包的内部结构，尝试：

• 移除next.config.js中针对该包的转译规则
• 删除node_modules和锁文件，重新安装依赖：

rm -rf node_modules package-lock.json
npm install

• 确认依赖版本兼容：firebase、@firebase/firestore、@stripe/firestore-stripe-payments需匹配，建议使用Firebase v9+对应版本的Stripe包。

3. 验证Firestore实例有效性 #

在调用getProducts()前，先手动测试Firestore集合访问是否正常：

import { collection, getDocs } from "firebase/firestore";

// 直接访问products集合，验证实例有效性
const testRef = collection(firestore, "products");
getDocs(testRef)
  .then(snap => console.log("集合访问成功，文档数：", snap.size))
  .catch(err => console.error("集合访问失败：", err));

如果此测试报错，需检查Firebase配置是否正确，或Firestore安全规则是否允许当前用户读取products集合。

4. 检查getProducts()调用方式 #

确保调用参数符合规范，避免传入无效参数：

// 正确调用示例
payments.products.getProducts({
  includePrices: true,
  activeOnly: true,
})
.then(products => console.log("获取产品成功：", products))
.catch(err => console.error("获取产品失败：", err));

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