获取当前UID对应的Firebase数据库内容返回undefined问题求助

Hey there! Let's break down why you're seeing undefined when trying to fetch user information. Given your stack version, these are the most likely issues to check:

1. Auth State Subscription Timing is Off #

In this version of AngularFire2, the Firebase Auth object doesn't immediately have a user on page load. If you're trying to access this.afAuth.auth.currentUser synchronously (without waiting for the auth state to emit), you'll almost certainly get undefined because the auth system hasn't finished initializing yet.

Wrong approach (synchronous access):

// This will often return undefined
const currentUser = this.afAuth.auth.currentUser;
this.getUserProfile(currentUser.uid); // Crashes or returns undefined

Correct approach (subscribe to authState):

this.afAuth.authState.subscribe(user => {
  if (user) {
    // Only fetch profile once we have a valid user object
    this.userProfile$ = this.db.object(`users/${user.uid}`).valueChanges();
  } else {
    // Handle unauthenticated state
  }
});

2. Profile Data Path or Structure Mismatch #

Double-check that your database path matches where you're storing user profiles, and that your profile.ts interface aligns with the actual data in Firebase.

• Path Check: If you're storing profiles under /users/{uid}, make sure your service isn't using a typo like /user/{uid} or /profiles/{uid}. Example of a correct service method:

  import { AngularFireDatabase } from 'angularfire2/database';
  
  constructor(private db: AngularFireDatabase) {}
  
  getUserProfile(uid: string) {
    // Verify this path matches your Firebase data structure
    return this.db.object(`users/${uid}`).valueChanges();
  }
  

• Interface Match: If your profile.ts defines a displayName: string field but your Firebase data uses fullName instead, the mapped object will have displayName: undefined. Ensure every field in your interface matches the key names in your database.

3. AngularFire2 Initialization is Incomplete #

For AngularFire2 v5.x, you need to properly import and initialize all required modules in your AppModule. Missing auth or database modules can lead to broken services that return undefined.

Check your AppModule imports:

import { AngularFireModule } from 'angularfire2';
import { AngularFireAuthModule } from 'angularfire2/auth';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { environment } from '../environments/environment';

@NgModule({
  imports: [
    AngularFireModule.initializeApp(environment.firebase), // Critical: Initialize with your config
    AngularFireAuthModule, // Required for auth services
    AngularFireDatabaseModule // Required for database access
  ],
  // ... other declarations/providers
})
export class AppModule { }

4. Fetching Profile Before Authentication Completes #

Even if you're subscribing to authState, make sure you aren't trying to fetch the profile before the user object is available. Always add an if (user) check to avoid passing an undefined uid to your profile fetch method.

5. Version-Specific Edge Cases #

Since you're using a release candidate version (5.0.0-rc.4), there are a few quirks to note:

• valueChanges() returns null if the requested data doesn't exist in the database. If you're treating null as undefined in your component, that could be the confusion point.
• Ensure you're using the correct import paths (e.g., angularfire2/auth not angularfire2/auth/auth in some older beta versions).

If you can share snippets of your profile.ts interface and the component/service code where you're fetching the user info, I can help narrow this down further!

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