How to get rid of "Error: permission_denied" when logging out? (Angular-Firebase)
How to get rid of "Error: permission_denied" when logging out? (Angular-Firebase)
嗨,我是 Angular 和 Firebase 的新手,对下一个问题感到困惑:
我有两个组件-
授权区域(父组件)和文件夹(子组件)。授权区域有一个注销按钮,文件夹可以访问来自 firebase 的授权数据。问题是,当用户注销时,虽然操作成功,但会出现一条错误消息,我正试图摆脱它。
父组件:授权区域
export class AuthorizedZoneComponent implements OnInit {
constructor(public authService: AuthService) { }
ngOnInit(): void {}
//btn logout listener
logout() { this.authService.logout(); }
}
<app-folders></app-folders>
<button id="logout"(click)="logout()">logout</button>`
子组件:文件夹
export interface Folder{
id:string;
name:string;
key: string;
}
//This Component is to be used only by Authorized-zone!
export class FoldersComponent implements OnInit {
private dbPath='/folders';//path to folders in realtime data base
private folderArray: Array<Folder>=[];//Array for folders: each folder has id and name
constructor(private router: Router, private route:ActivatedRoute, private db: AngularFireDatabase) {
this.db.list(this.dbPath).valueChanges().subscribe(data => {
for( let i=0; i< data.length; i++){
this.folderArray.push({id: data[i]["id"], name: data[i]["name"], key: data[i]["key"]});
}
})
}
ngOnInit(): void {}
//returns array of folders
getFolders(){ return this.folderArray;}
//on folder click listerner
onSelect(folder){}
}
<div (click)="onSelect(folder)" *ngFor="let folder of getFolders()>
<div class="folder" [id]="folder.id">{{folder.name}}</div>
</div>
授权服务允许用户登录和注销
事件流程似乎运行良好。
但是,当我按下注销按钮时,虽然功能正常,但我收到一条控制台错误消息:
ERROR Error: permission_denied at /folders: Client doesn't have permission to access the desired data...
我注意到如果我删除 <app-folders></app-folders>
错误不会出现。
我尝试在登录前删除 <app-folders></app-folders>
授权-zone.component:
//btn logout listener
logout() {
document.querySelector('app-folders').replaceWith("");
this.authService.logout();
}
它没有用,如果有人能够解释问题并推荐解决方案,我将非常感激
我找到了解决方案:在文件夹组件中使用 ngOnDestroy。
private dbData;
constructor(private router: Router, private route:ActivatedRoute, private db: AngularFireDatabase) {
this.dbData=this.db.list(this.dbPath).valueChanges()
.subscribe(data => {//...
})
}
//destroy firebaseData before logging out
ngOnDestroy(){
this.dbData.unsubscribe();
}
嗨,我是 Angular 和 Firebase 的新手,对下一个问题感到困惑:
我有两个组件-
授权区域(父组件)和文件夹(子组件)。授权区域有一个注销按钮,文件夹可以访问来自 firebase 的授权数据。问题是,当用户注销时,虽然操作成功,但会出现一条错误消息,我正试图摆脱它。
父组件:授权区域
export class AuthorizedZoneComponent implements OnInit {
constructor(public authService: AuthService) { }
ngOnInit(): void {}
//btn logout listener
logout() { this.authService.logout(); }
}
<app-folders></app-folders>
<button id="logout"(click)="logout()">logout</button>`
子组件:文件夹
export interface Folder{
id:string;
name:string;
key: string;
}
//This Component is to be used only by Authorized-zone!
export class FoldersComponent implements OnInit {
private dbPath='/folders';//path to folders in realtime data base
private folderArray: Array<Folder>=[];//Array for folders: each folder has id and name
constructor(private router: Router, private route:ActivatedRoute, private db: AngularFireDatabase) {
this.db.list(this.dbPath).valueChanges().subscribe(data => {
for( let i=0; i< data.length; i++){
this.folderArray.push({id: data[i]["id"], name: data[i]["name"], key: data[i]["key"]});
}
})
}
ngOnInit(): void {}
//returns array of folders
getFolders(){ return this.folderArray;}
//on folder click listerner
onSelect(folder){}
}
<div (click)="onSelect(folder)" *ngFor="let folder of getFolders()>
<div class="folder" [id]="folder.id">{{folder.name}}</div>
</div>
授权服务允许用户登录和注销
事件流程似乎运行良好。
但是,当我按下注销按钮时,虽然功能正常,但我收到一条控制台错误消息:
ERROR Error: permission_denied at /folders: Client doesn't have permission to access the desired data...
我注意到如果我删除 <app-folders></app-folders>
错误不会出现。
我尝试在登录前删除 <app-folders></app-folders>
授权-zone.component:
//btn logout listener
logout() {
document.querySelector('app-folders').replaceWith("");
this.authService.logout();
}
它没有用,如果有人能够解释问题并推荐解决方案,我将非常感激
我找到了解决方案:在文件夹组件中使用 ngOnDestroy。
private dbData;
constructor(private router: Router, private route:ActivatedRoute, private db: AngularFireDatabase) {
this.dbData=this.db.list(this.dbPath).valueChanges()
.subscribe(data => {//...
})
}
//destroy firebaseData before logging out
ngOnDestroy(){
this.dbData.unsubscribe();
}