我使用 canActivate 功能来保护一些路由(管理员)。对于这种情况,我确实使用了authGuard
类/函数:
问题是,当我尝试将 boolean 的可观察值返回为:return Observable.of(false);
时,它无法按预期工作并引发以下错误:
'(err: any) => Observable | 类型的参数 Observable' 不能分配给类型为“(错误:任何,捕获:Observable)=> ObservableInput”的参数。输入“可观察 | Observable' 不可分配给类型 'ObservableInput'。类型“Observable”不可分配给类型“ObservableInput”。类型“Observable”不可分配给类型“ArrayLike”。“可观察”类型中缺少属性“长度”。
我一直在搜索并发现这种问题,但不完全相同。并且提供的提示/解决方案是使用.throw(err);
当我将 return 更改为:return Observable.throw(err);
时,错误消失了,但为了保护我的路线,它没有false
按应有的方式返回。
我相信这是一个类型问题等,但我无法修复它,所以我不断返回observable.of(false)
canActivate( next: ActivatedRouteSnapshot, state: RouterStateSnapshot ): Observable<boolean> | Promise<boolean> | boolean {
return this.userService.getAdminAuth()
.map( (res) => {
if ( res === true) {
return true;
} else {
......
return false;
}
})
.catch( (err) => {
if ( err.status === 403 ) {
console.log(`403: ${err.status}`);
return this.userService.refreshToken()
.map( (res) => {
console.log(`Res RefreshToken: ${res}`);
});
}
return Observable.of(false); // protect route!
});
}
user.service.ts中的函数:
....
isAdminAuthenticated = false;
public getAdminAuth() {
console.log('Saved token: ' + localStorage.getItem('ac_token') );
if ( this.isAdminAuthenticated === true ) {
return Observable.of(true);
} else {
return this.http.get(
'URL', {
headers: new HttpHeaders({"Accept": "application/json"}),
withCredentials: true,
observe: "response"
}
)
.map((res) => {
if (res.status === 200) {
this.isAdminAuthenticated = true;
return true;
} else {
return false;
}
}, (err) => {
console.log('Error: ' + err);
return false;
});
}
}
refreshToken() {
return this.http.get(
'URL',
{
headers: new HttpHeaders(
{
"Accept": "application/json",
"Authorization" : "Bearer " + localStorage.getItem('ac_token')
}
),
withCredentials: true,
observe: "response"
}
)
}
另一方面,如果我将refreshToken
功能更改为:
refreshToken() {
return this._http.get(
'URL',
{
headers: new HttpHeaders(
{
"Accept": "application/json",
"Authorization" : "Bearer " + localStorage.getItem('ac_token')
}
),
withCredentials: true,
observe: "response"
}
).map( (res) => {
console.log(`Res: ${JSON.stringify(res)}` );
}), (err) => {
console.log(`Err: ${JSON.stringify(err)}` );
};
}
然后错误说:
src/app/admin.guard.ts(38,9) 中的错误:错误 TS2322:类型 'Observable' 不可分配给类型 'boolean | 承诺 | 可观察”。类型“Observable”不可分配给类型“Observable”。输入'布尔| {}' 不可分配给类型 'boolean'。类型“{}”不可分配给类型“布尔”。src/app/service.guard.ts: 错误 TS2339: 属性 'map' 不存在于类型 '(err: any) => boolean' 上。