可以通过在AuthService中添加一个名为“isLoggedIn”的公共方法来检查用户是否已经注销。此方法将返回一个Observable,该Observable将返回一个布尔值,指示用户的当前身份验证状态。 以下是一个示例AuthService,其中包含一个isLoggedIn方法:
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, BehaviorSubject } from 'rxjs';
import { tap } from 'rxjs/operators';
import { JwtHelperService } from '@auth0/angular-jwt';
import { environment } from '../../environments/environment';
@Injectable({
providedIn: 'root'
})
export class AuthService {
private loggedIn = new BehaviorSubject(false);
get isLoggedIn() {
return this.loggedIn.asObservable(); // 使用asObservable()方法使loggedIn变为只读
}
constructor(private http: HttpClient, public jwtHelper: JwtHelperService) { }
login(username: string, password: string): Observable {
// 登录逻辑
}
logout() {
// 注销逻辑
this.loggedIn.next(false); // 在注销时将loggedIn设置为false
}
isAuthenticated(): boolean {
const token = localStorage.getItem('access_token');
return !this.jwtHelper.isTokenExpired(token);
}
checkTokenValidity(): Observable {
const token = localStorage.getItem('access_token');
return this.http.get(`${environment.apiBaseUrl}/auth/check-token-validity?token=${token}`)
.pipe(
tap(() => {
this.loggedIn.next(true); // 在令牌有效且未注销时将loggedIn设置为true
}, () => {
this.loggedIn.next(false); // 在令牌无效时将loggedIn设置为false
})
);
}
}
在AppComponent中,我们可以使用AuthService的isLoggedIn方法来确定用户是否已注销:
import { Component, OnInit } from '@angular/core';
import { AuthService } from './services/auth.service';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
title = 'my-app';
isLoggedIn: boolean;
constructor(private authService: AuthService) {}
ngOnInit(): void {
this.authService.isLoggedIn.subscribe((loggedIn) => {
this.isLoggedIn = loggedIn;
});
}
}
在此示例中,我们订阅AuthService的isLoggedIn可观察对象,并在检测到身份验证状态更改时更新isLoggedIn属性。此属性可以在组件中用于显示/隐藏元素或更改用户Interface行为。