angular - 在 Angular 9 中使用 Oauth2 令牌刷新

Question

我有一个具有 oAuth2 用于登录的应用程序。以下是localStorage成功存储的关键值

这是我的login.ts

  login(email: string, password: string) {
  const user = new FormData();
  user.append("username", email);
  user.append("password", password);
  user.append("grant_type", grantType);
  this.http.post<any>("api1", user).pipe(
    switchMap((response) => {
        localStorage.setItem("token", response.access_token);
        localStorage.setItem("expiresIn", response.expires_in);//3200
        localStorage.setItem("refreshToken", response.refresh_token);
        localStorage.setItem("tokenType", response.token_type); //bearer
      this.myToken = response.access_token;
      console.log(this.myToken);
      if (this.myToken) {
        const body = new HttpParams().set("username", email).set("password", password);
        const headers = new HttpHeaders({
          "Content-Type": "application/x-www-form-urlencoded",
          Authorization: `${this.myToken}`
        });
        return this.http.post<any>("api2", body, { headers: headers });
      } else {
        alert("error: Not authorized");
        return EMPTY;
      }
    })
  ).subscribe(
    (response) => { console.log(response) },
    (error) => { }
  );
}

下面是我的auth.interceptor.ts。访问令牌到期后如何使用我的刷新令牌？

import {
  HttpInterceptor,
  HttpRequest,
  HttpHandler,
  HttpHeaders,
} from "@angular/common/http";
import { Injectable } from "@angular/core";

import { AuthService } from "./auth.service";

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  constructor(private authService: AuthService) {}

  intercept(req: HttpRequest<any>, next: HttpHandler) {
    const authToken = localStorage.setItem("token", response.access_token);;
    const headers = new HttpHeaders({
      Authorization: `${authToken}`,
    });
    const authRequest = req.clone({ headers });
    return next.handle(authRequest);
  }
}

标签： angulartypescriptoauth-2.0