HttpInterceptorは角度4.3で再試行します

Question

HttpInterceptorを使用して401エラーをキャッチするための最初のコードを作成しようとしています。私がしたいことは、条件に応じて新しい認証トークンを作成し、それを使って再試行することです。しかし、現在私のコードは再試行を行いますが、新しい認証トークンが作成される前にそれを行います。ここに私のコードです：私はまだ活字体の構文に精通取得しています

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<any> { 

    return next.handle(request).catch(error => { 

     if (error.status === 401) { 

      console.log('401 error'); 

      //check for valid refresh token 
      let refreshToken = localStorage.getItem('refresh_token'); 

      this._refreshTokenService.getRefreshToken(refreshToken).subscribe(
       refreshToken => { 
        if (refreshToken != null) { 

         console.log('valid refresh token') 

         //if valid refresh token, relogin and create new auth token 
         console.log(localStorage.getItem('auth_token')); 

         this._userService.logout(); 

         let email = localStorage.getItem('profile_email'); 

         this._userService.autoLogin(email) 
          .subscribe(
          result => { 
           if (result) { 
            console.log('new auth token created'); 

            let auth_token = localStorage.getItem('auth_token'); 

            //retry 
            request = request.clone({ headers: request.headers.set('Authorization', `Bearer ${auth_token}`) }); 
           } 
          }); 


        } 
        else { 
         console.log('invalid refresh token'); 
        } 
       }); 
      return next.handle(request); 
     } 
     else { 
      console.log(error.status); 
     } 
    }); 
} 

は、私は新しいトークンを作成した後に再試行がのみ発生するために必要があると思うが、私はこれで正確な構文のを確認していません場合。どんな助けでも大歓迎です！

Answer 1

申し訳ありませんが、私はコメントに返信することはできません。 これはObservableの連鎖に関するものだと思います。

あなたの最後のreturn next.handle(request);より前に電話をかけたものはすべて、あなたのhttpコールを発信する前に処理されます。 this._refreshTokenService.getRefreshToken(refreshToken).subsribe()内のすべてが非同期に処理されることを除いて。

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<any> { 
    return next.handle(request).catch(error => { 
     return this._refreshTokenService.getRefreshToken(refreshToken).subscribe(
      refreshToken => { 
       return next.handle(request); 
      } 
     ); 
    }); 
}