首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >TS7030:并非所有的代码路径都返回一个值。保护,canActivate方法Angular13

TS7030:并非所有的代码路径都返回一个值。保护,canActivate方法Angular13
EN

Stack Overflow用户
提问于 2022-05-30 19:06:27
回答 1查看 156关注 0票数 -1

我试图为未登录的用户使用保护,但ts总是返回一个错误。

TS7030:并非所有的代码路径都返回一个值。

我的auth.guard.ts文件:

代码语言:javascript
复制
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服务文件如下所示:

代码语言:javascript
复制
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();
    }
  }

}

还试图通过这种方式消除错误:

代码语言:javascript
复制
  canActivate(
        route: ActivatedRouteSnapshot,
        state: RouterStateSnapshot,
      ):
       Observable<boolean | UrlTree> 
      | Promise<boolean | UrlTree> 
      | boolean 
      | UrlTree
       
      {
        return this.auth.isAuthenticated()
          .pipe(map((isAuthenticated) => isAuthenticated || this.router.createUrlTree([''])))
      }}

但在这种情况下,我得到了另一个与管道使用相关的错误:

代码语言:javascript
复制
ts2339: property 'pipe' does not exist on type 'boolean'

我想知道我在第一个方法中传递数据的方式是否有问题,我应该在函数中再添加一个返回。可能是“if”结构在这里是不必要的。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-05-30 20:09:08

以下是几点意见:

TS7030:并非所有的代码路径都返回一个值。

当您不提供默认返回值时,将显示此消息。例如:

代码语言:javascript
复制
getUserById(string: id): User {
  // this function will only return a value if id is valid
  if (id) { 
    // some logic...
    return this.theUser;     
  }
}

解决方案是添加一个else语句,甚至更好的是添加return值。

代码语言:javascript
复制
getUserById(string: id): User {
  if (id) { 
    return this.theUser;     
  }

  return this.emptyUser; // your default return value
}

ts2339:属性“管道”在布尔型上不存在

pipe操作符是Observable接口的一种方法,可用于组合多个RxJS运算符来组成异步操作。

您的isAuthenticated()返回一个boolean,一个原语值。

如果您使用例如Observable操作符返回一个of,这将有效。

代码语言:javascript
复制
isAuthenticated(): Observable<boolean> {
 return of(!!this.token);
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/72439009

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档