Angular 8 在拦截器中订阅可观察对象

pen*_*ngz 5 interceptor observable rxjs angular angular8

我正在尝试编写一个 HTTP 拦截器来向请求添加“访问级别”参数。我试图从可观察的 currentAccessLevel$ 中获取值。但是,可观察对象未正确返回,并且拦截器破坏了整个请求周期。

这个问题已经在这里这里有了答案,但是,接受的答案似乎在 Angular 8 中不起作用。我不确定我是否做错了什么,或者是否对 Angular 8 中的拦截器进行了某种更改。

我还尝试过使用 switchMap、flatMap 和 mergeMap。

import { Injectable } from '@angular/core';
import {
  HttpRequest,
  HttpHandler,
  HttpEvent,
  HttpInterceptor
} from '@angular/common/http';
import { Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
import { AuthService } from 'src/app/services/auth/auth.service';

@Injectable()
export class AccessLevelInterceptor implements HttpInterceptor {
  private accessLevel: string;

  constructor(private authService: AuthService) { }

  // Intercept HTTP Requests
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    // Get current value of access level observable from authentication service
    return this.authService.currentAccessLevel$
      .mergeMap(res => next.handle(request));

  }

}
Run Code Online (Sandbox Code Playgroud)

currentAccessLevel$ 是在服务中作为BehaviorSubject 创建的字符串值,然后转换为Observable。这样,字符串的当前值可以在多个组件之间共享。

// Create a BehaviorSubject to track and share updates to currentAccessLevel value
  private currentAccessLevel: string;
  currentAccessLevelSubject: BehaviorSubject<string> = new BehaviorSubject(this.currentAccessLevel);
  currentAccessLevel$ = this.currentAccessLevelSubject.asObservable();
Run Code Online (Sandbox Code Playgroud)

Fed*_*one 3

是的,从 Rxjs 5.5 开始,这不再起作用了。您需要使用管道方法来连接运算符:

return this.authService.currentAccessLevel$
      .pipe(mergeMap(res => next.handle(request)));
Run Code Online (Sandbox Code Playgroud)

请查看此处以了解有关管道的更多信息。