Angular 8: 如何在没有刷新令牌的情况下刷新令牌
创始人
2024-10-17 18:00:59
0

在Angular 8中,可以使用httpClientrxjs库来实现在没有刷新令牌的情况下刷新令牌。以下是一个示例代码:

  1. 创建一个TokenInterceptor拦截器,用于拦截每个请求并检查令牌是否过期:
import { Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor } from '@angular/common/http';
import { Observable, BehaviorSubject, throwError } from 'rxjs';
import { catchError, filter, take, switchMap } from 'rxjs/operators';
import { AuthService } from './auth.service';

@Injectable()
export class TokenInterceptor implements HttpInterceptor {
  private refreshTokenInProgress = false;
  private refreshTokenSubject: BehaviorSubject = new BehaviorSubject(null);

  constructor(public authService: AuthService) {}

  intercept(request: HttpRequest, next: HttpHandler): Observable> {
    request = this.addToken(request, this.authService.getAccessToken());

    return next.handle(request).pipe(
      catchError(error => {
        if (error && error.status === 401) {
          // 如果返回401未授权错误,则尝试刷新令牌
          if (this.refreshTokenInProgress) {
            // 如果在刷新令牌的过程中遇到多个请求返回401错误,则等待刷新完成再继续发送请求
            return this.refreshTokenSubject.pipe(
              filter(result => result !== null),
              take(1),
              switchMap(() => next.handle(this.addToken(request, this.authService.getAccessToken())))
            );
          } else {
            this.refreshTokenInProgress = true;
            // 刷新令牌
            this.refreshTokenSubject.next(null);

            return this.authService.refreshToken().pipe(
              switchMap((token: any) => {
                this.refreshTokenInProgress = false;
                this.refreshTokenSubject.next(token.accessToken);
                return next.handle(this.addToken(request, token.accessToken));
              }),
              catchError((err: any) => {
                this.refreshTokenInProgress = false;
                this.authService.logout();
                return throwError(error);
              })
            );
          }
        } else {
          return throwError(error);
        }
      })
    );
  }

  addToken(request: HttpRequest, token: string): HttpRequest {
    return request.clone({
      setHeaders: {
        Authorization: `Bearer ${token}`
      }
    });
  }
}
  1. 创建一个AuthService服务,用于处理令牌的获取和刷新:
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class AuthService {
  private refreshTokenUrl = 'http://example.com/refresh-token';

  constructor(private http: HttpClient) {}

  getAccessToken(): string {
    // 返回当前存储的访问令牌
    return localStorage.getItem('accessToken');
  }

  refreshToken(): Observable {
    // 发送刷新令牌的请求并返回新的令牌
    return this.http.get(this.refreshTokenUrl);
  }

  logout(): void {
    // 清除本地存储的令牌并重定向到登录页面
    localStorage.removeItem('accessToken');
    // redirect to login page
  }
}
  1. 在你的app.module.ts中,将TokenInterceptor拦截器添加到HTTP_INTERCEPTORS提供者列表中:
import { NgModule } from '@angular/core';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { TokenInterceptor } from './token.interceptor';

@NgModule({
  imports: [HttpClientModule],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: TokenInterceptor,
      multi: true
    }
  ]
})
export class AppModule {}

通过以上步骤,每当发送请求时,TokenInterceptor拦截器会检查令牌是否已过期。如果过期,则会尝试刷新令牌,并重新发送请求。如果刷新令牌失败或返回401错误,则用户将被注销并重定向到登录页面。

相关内容

热门资讯

做出回应!四川家园茶馆辅助(辅... 做出回应!四川家园茶馆辅助(辅助)果然真的有辅助技巧(有挂辅助)1、玩家可以在四川家园茶馆辅助透视最...
相较于以往!广东老友麻将有挂吗... 相较于以往!广东老友麻将有挂吗(辅助)确实真的有辅助app(有挂详细)1、操作简单,无需广东老友麻将...
据报道!开心十三张有没有挂(辅... 据报道!开心十三张有没有挂(辅助)真是是有辅助技巧(有挂方略)1、开心十三张有没有挂辅助器安装包、开...
复盘辅助挂!皮皮四川麻辣(辅助... 复盘辅助挂!皮皮四川麻辣(辅助)其实确实有辅助插件(真实有挂)皮皮四川麻辣是不是有人用挂微扑克wpk...
2026版教学!蜂娱辅助(辅助... 2026版教学!蜂娱辅助(辅助)好像真的是有辅助方法(有挂工具)在进入蜂娱辅助软件靠谱后,参与本局比...
做出回应!家乡大二的技巧(辅助... 做出回应!家乡大二的技巧(辅助)其实真的有辅助技巧(有挂猫腻)家乡大二的技巧是不是有人用挂微扑克wp...
连日来!四川麻将血战到底定制插... 连日来!四川麻将血战到底定制插件辅助(辅助)好像是真的有辅助软件(确实有挂)1、全新机制【四川麻将血...
第三方插件!微乐自建房辅助可信... 第三方插件!微乐自建房辅助可信吗(辅助)原来真的有辅助工具(有挂技巧)运微乐自建房辅助可信吗辅助工具...
近日!大唐麻将开挂软件(辅助)... 近日!大唐麻将开挂软件(辅助)好像是有辅助方法(有挂方式)1、下载好大唐麻将开挂软件脚本下载之后点击...
值得注意的是!拼十app辅助(... 值得注意的是!拼十app辅助(辅助)都是存在有辅助教程(有挂教程)1、游戏颠覆性的策略玩法,独创攻略...