返回一个可观察到的正确答案

【问题标题】：return an observable correct返回一个可观察到的正确
【发布时间】：2022-01-06 03:12:57
【问题描述】：

我在最后几个小时关注了关于 jwt 刷新令牌的教程，但似乎代码有点旧并且有一些变化。所以我构建了一个拦截器，它遇到了 Observable 的问题，我不知道如何解决它。

错误是：

"函数缺少结束返回语句且返回类型没有包括“未定义””

我知道它会出现，因为我的 Observable 没有具体的回报。

我的代码：

intercept(request : HttpRequest<any>, next : HttpHandler): Observable<HttpEvent<any>> 
    {
        // Check if the user is logging in for the first time

        return next.handle(this.attachTokenToRequest(request)).pipe(
            tap((event : HttpEvent<any>) => {
                if(event instanceof HttpResponse) 
                {
                    console.log("Success");
                }
            }),
            catchError((err) : Observable<any> => { //Here comes the error message
                if(err instanceof HttpErrorResponse) {
                    switch((<HttpErrorResponse>err).status) 
                {
                        case 401:
                            console.log("Token expired. Attempting refresh ...");
                            return this.handleHttpResponseError(request, next);
                        case 400:
                            return <any>this.acct.logout();
                    }
                } else 
                {
                    return throwError(this.handleError);
                }
                //I think here should be a return but I don't know which kind, tried already a few ones
            })
            
           );

    }

我也可以给你看教程的原始代码，就是链接：

https://dev.azure.com/Techhowdy/_git/NG_Core_AuthRTDB?path=/ClientApp/src/app/_helpers/jwt.Interceptor.ts

【问题讨论】：

你需要返回一个 observable。 throwError 将创建一个 observable，它会根据您提供的值发出错误，因此 throwError(err) 将是一个不错的候选者。
啊好吧，至少有道理，你！
没问题！什么是this.handleError 顺便说一句？它是一个函数吗？抛出一个函数有点奇怪。
是的，你可以在我上面的链接中看到它，刚刚从教程中得到它，仍然在努力解决它，因为它不能很好地工作：D 从来没有对 jwt 刷新令牌做过任何事情
这有点令人困惑。你有handleHttpResponseError，但它处理任何http请求，而不是我期望的HttpErrorResponse。同时，您拥有处理HttpErrorResponses 的handleError。但是，由于您在调用它时处于 else 语句中，所以您知道 err 不是 ErrorHttpResponse。

标签： angular typescript observable interceptor

【解决方案1】：

通过返回新的 observable 或抛出错误来捕获要处理的 observable 上的错误。 catchError

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // Check if the user is logging in for the first time

    return next.handle(this.attachTokenToRequest(request)).pipe(
      tap((event: HttpEvent<any>) => {
        if (event instanceof HttpResponse) {
          console.log('Success');
        }
      }),
      catchError((err): Observable<any> => {
        if (err instanceof HttpErrorResponse && err.status === 401) return this.handleHttpResponseError(request, next);

        /**
         * I think the problem is here, the logout function does not return an observable and you can do like this
         */
        if (err instanceof HttpErrorResponse && err.status === 400) this.acct.logout();

        return throwError(this.handleError);
      }),
    );
  }

【讨论】：