代码之家 › 专栏 › 技术社区 › Adam Specker

角度可观测拦截器中的承诺价值

ionic4 angular7 observable promise angular

0

Adam Specker · 技术社区 · 7 年前

我正在尝试使用jwt拦截器服务来验证用户对一个ioc4应用程序的api所做的每个调用。我有一个JWT拦截器

export class JwtInterceptor implements HttpInterceptor {
  constructor(private authenticationService: AuthenticationService) { }

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // add authorization header with jwt token if available
    let token = 'THE_JWT_HERE'
    if (token) {
      request = request.clone({
        setHeaders: {
          Authorization: `Bearer ${token}`
        }
      });
    }

    return next.handle(request);
  }
}

它静态地将令牌添加到请求的正确头中。但是,我需要从离子存储中获得用户的实际jwt,这是基于承诺的。

我想可能是这样的:

export class JwtInterceptor implements HttpInterceptor {
  constructor(private authenticationService: AuthenticationService) { }

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // add authorization header with jwt token if available
    this.authenticationService.getJWT()
      .then(token => {
      if (token) {
        request = request.clone({
          setHeaders: {
            Authorization: `Bearer ${token}`
          }
        });
      }
    return next.handle(request);
  })
  }
}

这在编译时中断,因为我返回的是一个承诺,而不是一个可观察的。但是,如果我 return next.handle(request) 在承诺之外,没有添加授权头。我知道这是为什么,但我不确定解决办法。

我怎样才能从承诺中访问这个值,并在这个拦截器中使用它?

1 回复 | 直到 7 年前

1

derelict 7 年前

您需要使用一些rxjs——一种方法可能是切换映射:

import { switchMap } from "rxjs/operators"; 
import { from as observableFrom } from "rxjs";

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  return observableFrom(this.authenticationService.getJWT())
    .pipe(
      switchMap(token => {
        if (token) {
          request = request.clone({
            setHeaders: {
              Authorization: `Bearer ${token}`
            }
          });
        }
        return next.handle(request);
      })
    ); 
}

本质上,你想把承诺转换成一个可观察的,并把它合并成一个可观察的链,从而 Observable<HttpEvent<any>> 截获应该返回。

下一个逻辑问题是,是否有任何方法可以缓存authenticationservice请求,并在请求中简单地使用该缓存值?我建议在服务中使用访问器模式,在第一次请求令牌时查找它,然后简单地返回结果。如果您在每个httprequest之前执行authenticationservice请求,则会显著降低请求速度。