在反应应用程序中访问令牌过期后自动注销

Posted

技术标签:

【中文标题】在反应应用程序中访问令牌过期后自动注销【英文标题】:Auto logout after access token expires in react application 【发布时间】:2021-03-30 23:50:57 【问题描述】:

我有一个使用 react-aad-msal 库向 Azure AD 进行身份验证的反应应用程序。下面的代码工作正常。但是当访问令牌过期时,getAccessToken 方法会自动获取新的访问令牌并使应用程序继续运行。但相反,我需要要求用户在访问令牌过期时重新进行身份验证,并且用户是否在整个持续时间内都处于空闲状态。有办法吗?

  const apiAuthenticationParameters = 
    scopes: [config.appScope],
    forceRefresh: true,
  ;

  const getAccessToken = () => 
    return AuthProvider.getAccessToken(apiAuthenticationParameters);
  ;

【问题讨论】:

【参考方案1】:

如果令牌即将过期,似乎没有直接的方法来检查令牌。你可以参考这个类似的issue 中间件。

const checkTokenExpirationMiddleware = store => next => action => 
  const token =
    JSON.parse(localStorage.getItem("user")) &&
    JSON.parse(localStorage.getItem("user"))["token"];
  if (jwtDecode(token).exp < Date.now() / 1000) 
    next(action);
    localStorage.clear();
  
  next(action);
;

访问令牌的默认生命周期为 1 小时,请参阅here。您可以在时间之后调用注销功能。

【讨论】:

但是当令牌过期时,这种方法也会注销活动用户。但是只有当用户空闲时我才需要注销。我错过了在我的问题中提及,我已经更新了问题 可以通过react-idle-timer添加判断用户是否空闲。在此事件中注销handleOnIdle (event) console.log('user is idle', event) console.log('last active', this.idleTimer.getLastActiveTime())

以上是关于在反应应用程序中访问令牌过期后自动注销的主要内容,如果未能解决你的问题,请参考以下文章

jwt令牌过期后如何注销

滑动刷新令牌生存期过期后注销用户

当令牌在角度4中过期时如何重定向到注销

我们应该与访问令牌一起更新刷新令牌吗?

react app中令牌过期时如何注销用户

在 gapi.auth.authorize 之后调用注销时出错