typescript - Angular - 类型 'Observable' 不能赋值给类型 'Observable>'

我只是从教程中复制了这段代码

    import { Injectable } from '@angular/core';
    import {
      HttpInterceptor,
      HttpRequest,
      HttpHandler,
      HttpEvent,
      HttpErrorResponse
    } from '@angular/common/http';
    import { Observable, throwError, BehaviorSubject } from 'rxjs';
    import { AuthService } from './shared/auth.service';
    import { catchError, switchMap } from 'rxjs/operators';
    import { LoginResponse } from './login-response.payload';

    @Injectable({
      providedIn: 'root'
    })
    export class TokenInterceptor implements HttpInterceptor {

    isTokenRefreshing = false;
    refreshTokenSubject: BehaviorSubject<any> = new BehaviorSubject(null);
    constructor(public authService: AuthService) { }

    intercept(req: HttpRequest<any>,
        next: HttpHandler): Observable<HttpEvent<any>> {
        if (this.authService['getJwtToken']()) {
            this.addToken(req, this.authService['getJwtToken']());
        }

        return next.handle(req).pipe(catchError(error => {
          if (error instanceof HttpErrorResponse && error.status === 403){
            return this.handleAuthErrors(req, next);
          } else {
            return throwError(error);
          }
        }))
    }
    private handleAuthErrors(req: HttpRequest<any>, next: HttpHandler) {
        if (!this.isTokenRefreshing) {
            this.isTokenRefreshing = true;
            this.refreshTokenSubject.next(null);

            return this.authService['refreshToken']().pipe(
                switchMap((refreshTokenResponse: LoginResponse) => {
                    this.isTokenRefreshing = false;
                    
    this.refreshTokenSubject.next(refreshTokenResponse.authenticationToken);
                    return next.handle(this.addToken(req, 
    refreshTokenResponse.authenticationToken));
                })
            )
        }
    }
    private addToken(req: HttpRequest<any>, jwtToken: string) {
        return req.clone({
            headers: req.headers.set('Authorization',
                'Bearer ' + jwtToken)
            });
        }

    }

我收到了这个错误

 'The type 'Observable<unknown>' is not assignable to type 
'Observable<HttpEvent<any>>
 Type 'unknown' is not assignable to type 'HttpEvent<any>'.

错误是由这里引起的

    return next.handle(req).pipe(catchError(error => {
          if (error instanceof HttpErrorResponse && error.status === 404){
            return this.handleAuthErrors(req, next);
          } else {
            return throwError(error);
          }
        }))

我应该改什么才能让它工作??（顺便说一下，这是文章：https://programmingtechie.com/2020/04/05/build-a-full-stack-reddit-clone-with-spring-boot-and-angular-part-13/#Refresh_Token_Process_-_Step_by_Step）

答案＃1

我尝试分析你的代码，但我无法理解原因。如果你在寻找解决方案，你可以在函数签名中添加返回类型 Observable<HttpEvent<any>>，如下所示：

private handleAuthErrors(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>>

在 StackBlitz 的模拟 Angular 游乐场中查看文件 check.js

这将解决由使用 switchMap 引起的问题

参见相关帖子

另外，根据这个，这可能与最近在 rxjs 版本之间的切换有关。尝试重启 IDE 并清除缓存的 node_modules

答案＃2

看看这个类似的问题：

这里有两个问题，你需要将返回值类型转换为你的输出类型，同时 imports 中缺少 finalize。

Angular 拦截器

我希望我能帮到你！

此致 敬礼，塞巴斯蒂安