Angular: Refresh-Token nur einmal

Question

Ich verwende JWT mit Refresh-Token-Strategie als Authentifizierung und ich habe einen Interceptor in meinem Angular-Client, der das Token als Header sendet.

Ich überprüfe vor dem Senden den Ablauf und aktualisiere das Token bei Bedarf mit meinem refreshToken.

Das Problem ist, wenn Sie 2 (oder mehr) Anfragen senden, beide versuchen, das Token zu aktualisieren. Ich benötige eine Funktion, die req für Refresh-Token sendet und wenn sie mehrere Male auf einmal aufgerufen wird, nur 1 http req zum Aktualisieren auf den Server gibt und das neue aktualisierte Token an alle zurückgibt, die es aufgerufen haben.

Das ist mein Interceptor:

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
    const authService = this.inj.get(AuthService); 
    const token = authService.getToken(); 

    // if no token or this is a refresh token req 
    if (!token || req.url.split('/').pop() === 'refreshToken') { 
     return next.handle(req); 
    } 

    const decoded = jwt.decode(token); 

    // if token expired 
    if (decoded.exp < (Date.now()/1000)) { 
     return authService.refreshJWTToken().concatMap((newToken) => { 
     const clonedReq = req.clone({ 
      headers: req.headers.set('Authorization', 'JWT ' + newToken) 
     }); 
     return next.handle(clonedReq); 
     }); 
    } 

    const clonedReq = req.clone({ headers: req.headers.append('Authorization', 'JWT ' + token) }); 
    return next.handle(clonedReq); 
    } 

Die Funktion, die ich brauche, ist authService.refreshJWTToken();

Ich weiß, dass es etwas mit Observable-Operatoren zu tun hat, aber ich bin ein bisschen neu dazu.

Answer 1

Ordnung habe ich es nach der Lektüre dieses: https://www.intertech.com/Blog/angular-4-tutorial-handling-refresh-token-with-new-httpinterceptor/

Meine Funktion sieht wie folgt aus (auch die erf Handling):

handleRefreshToken(req: HttpRequest<any>, next: HttpHandler): Observable<any> { 
    const authService = this.inj.get(AuthService); 

    if (!this.isRefreshingToken) { 
    this.isRefreshingToken = true; 

    // Reset here so that the following requests wait until the token 
    // comes back from the refreshToken call. 
    authService.tokenSubject.next(null); 

    return authService.doRefreshToken() 
     .switchMap((newToken: string) => { 
     authService.tokenSubject.next(newToken); 
     return next.handle(this.addToken(req, newToken)); 
     }) 
     .catch(err => { 
     authService.logout(); 
     return Observable.throw(err); 
     }) 
     .finally(() => { 
     this.isRefreshingToken = false; 
     }); 
    } else { 
    return authService.tokenSubject 
     .filter(token => token != null) 
     .take(1) 
     .switchMap(token => { 
     return next.handle(this.addToken(req, token)); 
     }); 
    } 
} 

Dank Vadim (die vagin) Siomin für die Hilfe!