Firebase实时数据库GET请求报错：TypeError读取undefined的pieceNum_属性

问题详情 #

• 已完成Next.js应用部署，且Firebase实时数据库连接正常（日志验证数据库名称正确）
• 请求代码：

get(child(database, `patent_id/${input}`)).then((snapshot) => {
  if (snapshot.exists()) {
    console.log(snapshot.val());
  } else {
    console.log("No data available");
  }
}).catch((error) => {
  console.error(error);
});

• 报错信息：

Unhandled Runtime Error TypeError: Cannot read properties of undefined (reading 'pieceNum_')

解决方法 #

1. 统一Firebase SDK版本

这个错误大概率是SDK版本不兼容导致的，先把firebase包更新到最新稳定版，避免跨版本调用冲突：

npm install firebase@latest
# 用yarn的话执行：yarn add firebase@latest

2. 修正Firebase实例初始化逻辑

Next.js的SSR/SSG环境下，重复初始化Firebase实例会导致异常，建议按以下方式封装初始化代码（比如新建lib/firebase.js）：

import { initializeApp, getApps, getApp } from "firebase/app";
import { getDatabase } from "firebase/database";

const firebaseConfig = {
  // 替换成你的Firebase配置
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_AUTH_DOMAIN",
  databaseURL: "YOUR_DATABASE_URL",
  projectId: "YOUR_PROJECT_ID",
  storageBucket: "YOUR_STORAGE_BUCKET",
  messagingSenderId: "YOUR_SENDER_ID",
  appId: "YOUR_APP_ID"
};

// 确保只初始化一次
const app = !getApps().length ? initializeApp(firebaseConfig) : getApp();
export const database = getDatabase(app);

3. 校验请求参数有效性

确认input变量不为undefined或null，否则会生成无效的数据库路径，触发异常：

// 先加参数校验
if (!input || typeof input !== 'string') {
  console.error("请求参数input无效");
  return;
}

get(child(database, `patent_id/${input}`)).then((snapshot) => {
  // ...原逻辑
}).catch((error) => {
  console.error(error);
});

4. 检查数据库读写规则

临时开放数据库规则测试（测试完成后务必改回安全规则），确认不是权限问题导致的异常：
在Firebase控制台的实时数据库规则中，设置为：

{
  "rules": {
    ".read": true,
    ".write": true
  }
}

5. 针对Next.js服务端组件的特殊处理

如果是在服务端组件中调用Firebase，尝试用动态导入禁用SSR，避免环境不兼容：

import dynamic from 'next/dynamic';

// 动态导入Firebase数据库方法，禁用SSR
const { get, child } = dynamic(() => import('firebase/database'), { ssr: false });

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