检查令牌过期并注销用户

时间:2021-05-10 08:06:58

标签: reactjs redux axios jwt redux-saga

我想根据令牌的到期时间注销用户。我知道 Axios 调用有问题,但我不确定是什么问题。此外,它似乎可以手动注销用户,但仍会捕获错误。

actions.js

export const logoutUser = (history) => ({
  type: LOGOUT_USER,
  payload: { history },
});

store.js

export const checkTokenExpiration = (next) => (action) => {
  const token =
    JSON.parse(localStorage.getItem('user')) &&
    // eslint-disable-next-line dot-notation
    JSON.parse(localStorage.getItem('user'))['token'];
  if (jwtDecode(token).exp < Date.now() / 1000) {
    next(action);
    localStorage.clear();
  }
  next(action);
};

const logoutAsync = async (history) => {
  await axios
    .logoutUser()
    .checkTokenExpiration.then((user) => user)
    .catch((error) => error);
  console.log();
  history.push(adminRoot);
};

这是错误信息:

<块引用>

axios__WEBPACK_IMPORTED_MODULE_3___default.a.logoutUser 不是函数

<块引用>

任务注销时出现上述错误 由 takeEvery(LOGOUT_USER, logout) 创建 由 watchLogoutUser 创建 由 rootSaga 创建 创建者 rootSaga

1 个答案:

答案 0 :(得分:0)

事实证明,我一直在错误的地方进行检查。

在一些帮助下发现我可以在另一个函数下检查,这里是代码:

const ProtectedRoute = ({
  component: Component,
  roles = undefined,
  ...rest
}) => {
  function isAuthActive() {
    const user = JSON.parse(localStorage.getItem('User'));
    const expiryTime = new Date(user?.expiration * 1000).toLocaleString(
      'en-sg'
    );
    const currentTime = new Date().toLocaleString('en-sg');
    if (expiryTime < currentTime) {
      setCurrentUser();
      localStorage.clear();
      return <Redirect to="/login" />;
    }
    return true;
  }
};

基本上只是根据令牌给出的到期时间检查当前时间。其余设置在后端服务器中。