如何检查 JWT 令牌是不是在 Angular 8 中过期

Posted 2023-03-10

【中文标题】如何检查 JWT 令牌是不是在 Angular 8 中过期

【英文标题】：How to check if JWT token is expired in Angular 8如何检查 JWT 令牌是否在 Angular 8 中过期

【发布时间】：2020-06-30 15:29:53

【问题描述】：

在 Angular 8 中检查 JWT 令牌是否已过期的不同方法。到期时间为 1 小时。 工作代码/示例将不胜感激。

【问题讨论】：

我用这个，真的很简单：github.com/auth0/angular-jwt

您可以使用这个包“npmjs.com/package/jwt-decode”并在canActivate上查看到期时间

【参考方案1】：

您可以使用 Angular-JWT 包获取令牌到期日期

 getTokenExpirationDate(token: string): Date 
    const decodedToken = helper.decodeToken(token);

    if (decodedToken.exp === undefined)  return null; 

    const date = new Date(0);
    date.setUTCSeconds(decodedToken.exp);
    return date;
  

【讨论】：

这会为 angular 12 引发错误，null 不能分配给类型 date

【参考方案2】：

我在我的应用中实现了类似的东西，它运行良好：

this.userToken$.pipe(
            filter((token: AuthToken) => !!token),
            map((token: AuthToken) => token.expiresIn()),
            tap((expiresIn: number) => console.log('token expires in', expiresIn / 1000 / 60, 'minutes')),
            switchMap((expiresIn: number) => timer(expiresIn)),
        ).subscribe(() => 
            console.warn('token expires');
            this.logout();
        );

这样，用户在尝试执行新请求时不会注销，而是在令牌过期时立即注销。

【讨论】：

userToken$ 是什么？

一个自定义对象的可观察对象，其中包含有关 JWT 的一些信息（到期日期、用户 ID...）。就我而言，它是从本地存储中检索的。

【参考方案3】：

选项 1 - 手动

令牌到期时间以UTC time 格式编码在令牌中。因此可以根据 UTC 的当前时间手动获取和检查它。试试下面的

private tokenExpired(token: string) 
  const expiry = (JSON.parse(atob(token.split('.')[1]))).exp;
  return (Math.floor((new Date).getTime() / 1000)) >= expiry;


ngOnInit() 
  if (this.tokenExpired(token)) 
    // token expired
   else 
    // token valid
  

选项 2 - 使用 JwtHelperService

您可以使用JwtHelperService 的isTokenExpired() 方法来检查令牌是否已经过期。

import JwtHelperService from '@auth0/angular-jwt';
.
.
constructor(private jwtHelper: JwtHelperService)  

ngOnInit() 
  if (this.jwtHelper.isTokenExpired(token)) 
    // token expired 
   else 
    // token valid
  

【讨论】：

您好，选项 2（即使用第三方 auth0 库）是一个好的解决方案吗？

@Southstar：快速浏览isTokenExpired() 的源代码可以看出它与手册的实现大致相同。我会使用它是个人意见和方便的问题。