Angular使用Firebase实时数据库遭遇401未授权错误求助

你的核心问题是手动通过HttpClient调用Firebase实时数据库，既没有使用正确的SDK操作方式，也混淆了请求目标——Firebase SDK会自动处理认证后的数据库权限校验，完全不需要手动添加Authorization头。

1. 修复步骤 #

第一步：确保安装Firebase数据库兼容包 #

如果还没安装，执行以下命令：

npm install firebase/compat/database

第二步：完善App模块的Firebase初始化 #

在app.module.ts中引入数据库模块：

import firebase from 'firebase/compat/app';
import 'firebase/compat/database'; // 新增引入数据库SDK

import { environment } from '../environments/environment';
firebase.initializeApp(environment.firebase);

第三步：重构数据库写入方法 #

直接使用Firebase SDK操作数据库，SDK会自动携带认证信息，无需手动处理Token：

writeDataToDatabase(data: any): Observable<any> {
  const email = 'mail@gmail.com';
  const password = 'pass';

  return from(firebase.auth().signInWithEmailAndPassword(email, password)).pipe(
    switchMap(() => {
      console.log('Authentication successful');
      // 替换为你的实时数据库节点路径，比如"users/123"
      const dbRef = firebase.database().ref('your-target-node');
      // set方法用于写入/覆盖数据，push方法用于添加新节点
      return from(dbRef.set(data));
    }),
    map(() => ({ message: '数据写入成功' }))
  );
}

2. 为什么之前的代码报错？ #

• 请求目标错误：你代码中调用的this.httpClient.get('<URL>/ip.json')是一个外部IP查询接口，和Firebase实时数据库的写入操作完全无关。
• 认证方式冗余：Firebase SDK在用户认证后，会自动为数据库请求附加权限凭证，手动添加Authorization头属于画蛇添足，反而可能因Token格式或权限范围问题触发401。
• REST API使用不当：即便要直接调用Firebase实时数据库的REST API，也需要使用正确的节点URL（格式为https://<你的项目ID>.firebaseio.com/目标节点.json），且SDK方式远比手动调用更可靠。

3. 额外检查项 #

• 确认environment.firebase配置中包含databaseURL（从Firebase控制台复制的Web应用配置里自带）。
• 确认Firebase控制台的认证>登录方式中已启用「邮箱/密码」登录。

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