Observer在next(undefined)之后不工作

Question

我有一个currentUser$在AccountService;

private currentUserSource = new ReplaySubject<User>(1);
currentUser$ = this.currentUserSource.asObservable();

登录方法:

this.currentUserSource.next(user);

在Logout方法中:

this.currentUserSource.next(undefined);

In Auth Guard:

canActivate(route: ActivatedRouteSnapshot): Observable<boolean> {
return this.accountService.currentUser$.pipe(
map(user  => {
if(user){
return true;
}
this.toastr.error('Unauthorized');
this.router.navigateByUrl('/login');
return false;
}));

}

现在的问题是，一旦我登录Auth守卫工作正常，但退出后，我试图打开相同的路由，它给了我空白屏幕。有人能检查一下我做错了什么吗?

路线:

path: '',
runGuardsAndResolvers: 'always',
canActivate: [AuthGuard],
children: [
{ path: 'users', component: UserListComponent}]

Package.json

"dependencies": {
"@angular/animations": "~12.1.2",
"@angular/common": "~12.1.2",
"@angular/compiler": "~12.1.2",
"@angular/core": "~12.1.2",
"@angular/forms": "~12.1.2",
"@angular/platform-browser": "~12.1.2",
"@angular/platform-browser-dynamic": "~12.1.2",
"@angular/router": "~12.1.2",
"@kolkov/ngx-gallery": "^1.2.3",
"@schematics/angular": "^9.1.0",
"bootstrap": "4.1.1",
"bootswatch": "^5.0.2",
"font-awesome": "^4.7.0",
"ng2-file-upload": "^1.4.0",
"ngx-bootstrap": "^6.2.0",
"ngx-spinner": "^12.0.0",
"ngx-timeago": "^2.0.0",
"ngx-toastr": "^14.0.0",
"rxjs": "~6.6.0",
"tslib": "^1.9.3",
"zone.js": "~0.11.4"},

控制台:

[WDS] Disconnected! polyfills.js:9720:9
close https://localhost:4200/polyfills.js:9720
initSocket https://localhost:4200/polyfills.js:9890
dispatchEvent https://localhost:4200/polyfills.js:1893
_close https://localhost:4200/polyfills.js:2774
timer https://localhost:4200/polyfills.js:12878
invokeTask https://localhost:4200/polyfills.js:10723
runTask https://localhost:4200/polyfills.js:10495
invokeTask https://localhost:4200/polyfills.js:10804
invoke https://localhost:4200/polyfills.js:10793
0 https://localhost:4200/polyfills.js:12858
(Async: setTimeout handler)
scheduleTask https://localhost:4200/polyfills.js:12860
scheduleTask https://localhost:4200/polyfills.js:10710
scheduleTask https://localhost:4200/polyfills.js:10538
scheduleMacroTask https://localhost:4200/polyfills.js:10561
scheduleMacroTaskWithCurrentZone https://localhost:4200/polyfills.js:10996
setNative https://localhost:4200/polyfills.js:12902
name https://localhost:4200/polyfills.js:11292
_close https://localhost:4200/polyfills.js:2763
_transportClose https://localhost:4200/polyfills.js:2716
g https://localhost:4200/polyfills.js:1778
emit https://localhost:4200/polyfills.js:1802
onclose https://localhost:4200/polyfills.js:4981
wrapFn https://localhost:4200/polyfills.js:11080
invokeTask https://localhost:4200/polyfills.js:10723
runTask https://localhost:4200/polyfills.js:10495
invokeTask https://localhost:4200/polyfills.js:10804
invokeTask https://localhost:4200/polyfills.js:11917
globalZoneAwareCallback https://localhost:4200/polyfills.js:11943
(Async: EventListener.handleEvent)
customScheduleGlobal https://localhost:4200/polyfills.js:12069
scheduleTask https://localhost:4200/polyfills.js:10710
scheduleTask https://localhost:4200/polyfills.js:10538
scheduleEventTask https://localhost:4200/polyfills.js:10564
makeAddListener https://localhost:4200/polyfills.js:12224
set https://localhost:4200/polyfills.js:11141
WebSocketTransport https://localhost:4200/polyfills.js:4979
_connect https://localhost:4200/polyfills.js:2620
_receiveInfo https://localhost:4200/polyfills.js:2595
g https://localhost:4200/polyfills.js:1778
emit https://localhost:4200/polyfills.js:1802
doXhr https://localhost:4200/polyfills.js:2339
g https://localhost:4200/polyfills.js:1778
emit https://localhost:4200/polyfills.js:1802
InfoAjax https://localhost:4200/polyfills.js:2123
g https://localhost:4200/polyfills.js:1778
emit https://localhost:4200/polyfills.js:1802
onreadystatechange https://localhost:4200/polyfills.js:3443
wrapFn https://localhost:4200/polyfills.js:11080
invokeTask https://localhost:4200/polyfills.js:10723
runTask https://localhost:4200/polyfills.js:10495
invokeTask https://localhost:4200/polyfills.js:10804
invokeTask https://localhost:4200/polyfills.js:11917
globalZoneAwareCallback https://localhost:4200/polyfills.js:11943
(Async: EventListener.handleEvent)
customScheduleGlobal https://localhost:4200/polyfills.js:12069
scheduleTask https://localhost:4200/polyfills.js:10710
scheduleTask https://localhost:4200/polyfills.js:10538
scheduleEventTask https://localhost:4200/polyfills.js:10564
makeAddListener https://localhost:4200/polyfills.js:12224

这是我在控制台得到的，但我认为这不是我的情况下的问题。

Answer 1

我已经通过使用take(1)在Auth守卫中修复了它。

canActivate(route: ActivatedRouteSnapshot): Observable<boolean> {
let isUser = false;
this.accountService.currentUser$.pipe(take(1)).subscribe((user) => {
if (user) isUser = true;
});
if (isUser) return of(true);
else {
this.toastr.error('Unauthorized');
this.router.navigateByUrl('/login');
return of(false);
}}}