Angular 11集成Firebase Realtime Database出现Database URL无法识别报错

根因分析 #

你新增的Firebase重复初始化规避逻辑中，判断存在已初始化实例时会直接复用现有实例，但该实例是你项目其他位置预先初始化的，其配置缺失databaseURL参数，因此调用firebase.database()时读取不到对应配置抛出报错。你组件内填写的配置本身正确，但运行时没有触发组件内的初始化分支，实际使用的是缺配置的全局实例。

解决方案 #

方案1：统一全局初始化（推荐） #

Angular项目不推荐在业务组件中初始化Firebase，统一全局初始化可从根源避免该类问题：

1. 移除所有组件内的Firebase初始化代码，全局唯一的初始化逻辑放在根模块app.module.ts中，确保配置包含完整的databaseURL参数。
2. 优先使用Angular官方适配的@angular/fire包管理Firebase服务，可原生规避重复初始化问题，配置示例：

// app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AngularFireModule } from '@angular/fire';
import { AngularFireDatabaseModule } from '@angular/fire/database';
import { environment } from '../environments/environment';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    // 传入完整的Firebase配置
    AngularFireModule.initializeApp(environment.firebaseConfig),
    AngularFireDatabaseModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

environment.firebaseConfig为从Firebase控制台复制的完整配置，需包含databaseURL字段。

方案2：组件内使用独立实例（快速修复） #

如果不方便修改全局逻辑，可给组件内使用的Firebase实例指定独立名称，避免复用全局缺配置的实例，修改组件构造函数代码如下：

constructor(
  private profileService: AuthService
) {
  let chatApp: firebase.app.App;
  // 仅判断专属命名的实例是否存在
  if (!firebase.apps.some(app => app.name === 'chatRoomApp')) {
    chatApp = firebase.initializeApp({
      apiKey: "blablabla",
      authDomain: "blablabla",
      databaseURL: "blablabla",
      projectId: "blablabla",
      storageBucket: "blablabla",
      messagingSenderId: "blablabla",
      appId: "blablabla"
    }, 'chatRoomApp');
  } else {
    chatApp = firebase.app('chatRoomApp');
  }

  // 从专属实例调用数据库接口
  this.ref = chatApp.database().ref('messages');
  this.ref.on("value", (snapshot: any) => {
    console.log(snapshot.val());
    this.items = snapshot.val();
  });
}

验证方式 #

修改前可先打印当前默认实例的配置，确认问题：

console.log(firebase.app().options);

如果打印结果中不存在databaseURL字段，即可确认根因判断正确。

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