我正在尝试使用 Angular 和 Firebase 实时数据库设置管理路由，以便具有管理员权限的用户可以访问网站的某些部分。我已经为管理员帐户设置了 isAdmin： true。但是，使用管理员帐户登录后，isAdmin会变为红色并自动删除。
app-user.ts
export interface AppUser{
name: string;
isAdmin: boolean;
email: string;
}
user.service.ts
constructor(private db: AngularFireDatabase) { }
save(user: firebase.User){
this.db.object('/users/' + user.uid).set({
name: user.displayName,
email: user.email
});
}
get(uid: string): Observable<any>{
return this.db.object('/users/'+uid).valueChanges();
}
auth.service.ts
export class AuthService {
user$: Observable<firebase.User>;
constructor(private afAuth: AngularFireAuth, private route: ActivatedRoute, private userService: UserService) {
this.user$=afAuth.authState;
}
login(){
let returnUrl = this.route.snapshot.queryParamMap.get('returnUrl') || '/';
localStorage.setItem('returnUrl', returnUrl);
this.afAuth.auth.signInWithRedirect(new firebase.auth.GoogleAuthProvider);
}
logout(){
this.afAuth.auth.signOut();
}
get appUser$(): Observable<AppUser> {
return this.user$.pipe(
switchMap((user) => {
if (user) {
return this.userService.get(user.uid);
} else {
return of(null);
}
})
);
}
}
auth-guard.service.ts
export class AuthGuard implements CanActivate {
constructor(private auth: AuthService, private router: Router) { }
canActivate() {
return this.auth.user$.pipe(map(user => {
if(user) return true;
this.router.navigate(['/login']);
return false;
}));
}
}
admin-auth-guard.service.ts
export class AdminAuthGuardService implements CanActivate {
constructor(private auth: AuthService, private userService: UserService) { }
canActivate(): Observable<boolean> {
return this.auth.user$.pipe(switchMap((user: firebase.User) =>
this.userService.get(user.uid)),
map((appUser) => appUser.isAdmin));
}
}
经过几个小时的编辑代码，我终于找到了解决方案。到目前为止，在将用户保存在实时数据库中时，我一直在使用set方法来存储用户详细信息，这使得每次管理员登录时isAdmin都会消失。
user.service.ts
export class UserService {
constructor(private db: AngularFireDatabase) { }
save(user: firebase.User){
this.db.object('/users/' + user.uid).update({
name: user.displayName,
email: user.email
});
}
get(uid: string): Observable<any>{
return this.db.object('/users/'+uid).valueChanges();
}
}