我试图为未登录的用户使用保护,但ts总是返回一个错误。
TS7030:并非所有的代码路径都返回一个值。
我的auth.guard.ts文件:
import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot, UrlTree} from '@angular/router';
import { Observable } from 'rxjs';
import { AuthService } from './auth.service';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(
private auth:AuthService,
private router:Router,
) {}
canActivate(
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot
):
Observable<boolean | UrlTree>
| Promise<boolean | UrlTree>
| boolean
| UrlTree
{
if (this.auth.isAuthenticated()) {
return true;
} else {
this.auth.logout();
this.router.navigate(['/admin', 'login'], {
queryParams: {
loginAgain: true}
});
}
}
}我的auth服务文件如下所示:
import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Observable, Subject, throwError } from 'rxjs';
import { catchError, tap } from 'rxjs/operators';
import { FbAuthResponse, User } from '../../../shared/interfaces';
import { environment } from '../../../../environments/environment';
@Injectable({ providedIn: 'root' })
export class AuthService {
constructor(private http: HttpClient) {}
public error$: Subject<string> = new Subject<string>();
get token(): string {
const expDate = new Date(localStorage.getItem('fb-token-expires'));
if (new Date() > expDate) {
this.logout();
return null;
}
return localStorage.getItem('fb-token');
}
login(user: User): Observable<any> {
user.returnSecureToken = true;
return this.http.post(`https://identitytoolkit.googleapis.com/v1/accounts:signInWithPassword?key=${environment.apikey}`, user)
.pipe(
tap<any>(this.setToken),
catchError(this.handleError.bind(this)),
);
}
logout() {
this.setToken(null);
}
isAuthenticated() {
return !!this.token;
}
private setToken(response: FbAuthResponse | null) {
if (response) {
const expDate = new Date(new Date().getTime() + +response.expiresIn * 1000);
localStorage.setItem('fb-token', response.idToken);
localStorage.setItem('fb-token-exp', expDate.toString());
} else {
localStorage.clear();
}
}}
还试图通过这种方式消除错误:
canActivate(
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot,
):
Observable<boolean | UrlTree>
| Promise<boolean | UrlTree>
| boolean
| UrlTree
{
return this.auth.isAuthenticated()
.pipe(map((isAuthenticated) => isAuthenticated || this.router.createUrlTree([''])))
}}但在这种情况下,我得到了另一个与管道使用相关的错误:
ts2339: property 'pipe' does not exist on type 'boolean'我想知道我在第一个方法中传递数据的方式是否有问题,我应该在函数中再添加一个返回。可能是“if”结构在这里是不必要的。
发布于 2022-05-30 20:09:08
以下是几点意见:
TS7030:并非所有的代码路径都返回一个值。
当您不提供默认返回值时,将显示此消息。例如:
getUserById(string: id): User {
// this function will only return a value if id is valid
if (id) {
// some logic...
return this.theUser;
}
}解决方案是添加一个else语句,甚至更好的是添加return值。
getUserById(string: id): User {
if (id) {
return this.theUser;
}
return this.emptyUser; // your default return value
}ts2339:属性“管道”在布尔型上不存在
pipe操作符是Observable接口的一种方法,可用于组合多个RxJS运算符来组成异步操作。
您的isAuthenticated()返回一个boolean,一个原语值。
如果您使用例如Observable操作符返回一个of,这将有效。
isAuthenticated(): Observable<boolean> {
return of(!!this.token);
}https://stackoverflow.com/questions/72439009
复制相似问题