Question

有人可以帮助我解决此问题吗？我不知道如何对我的React应用程序实施过期的会话。

我有expires_in: 86400的json数据，当注销用户到期时，需要执行哪些操作才能实现此功能。

我使用react.JS和redux。

操作：

export const signin = obj => {
  return dispatch => {
    let data = {
      method: "post",
      url: "/oauth/token",
      data: {
        grant_type: "password",
        client_id: CLIENT_ID,
        client_secret: CLIENT_SECRET,
        username: obj.email,
        password: obj.password
      }
    };
    return API(data)
      .then(res => {
        window.localStorage.setItem("access_token", res.data.access_token);
        console.log('uuuuuuuuuu', res)
        dispatch({
          type: AUTH.LOGGED_IN,
          payload: {
            access_token: res.data.access_token,
            expired_in: res.data.expires_in
          }
        });
      })
      .catch(err => {
        throw err;
      });
  };
};

Answer 1

从您发现的代码中。您已使用window.localStorage.setItem("access_token", res.data.access_token); 但是您实际上在那里需要一个cookie，并从响应中设置过期时间。然后，您必须检查Cookie是否存在于父组件中。如果它不存在（过期），则可以重定向到登录页面。

对于强制注销，您只需使cookie过期即可。 ;）

Answer 2

您不应存储剩余时间，而应存储当前时间+剩余时间。否则，您将无法确定何时发生。

Answer 3

您可以简单地使用setTimeout函数来实现此功能以触发注销功能。以下代码是基于expires_in是相对时间而不是绝对时间的假设。

    window.localStorage.setItem("access_token", res.data.access_token);
    setTimeout(logoutFunction, response.data.expires_in)
    console.log('uuuuuuuuuu', res)
    dispatch({
      type: AUTH.LOGGED_IN,
      payload: {
        access_token: res.data.access_token,
        expired_in: res.data.expires_in
      }
    });

和您的logoutFunction看起来像这样：

function logOutFunction() {
   window.localStorage.removeItem("access_token");
   // your redux dispatch and probably a redirection logic to go to a proper UX page
}

我在评论中错误地说要使用setInterval。我认为这将是一次执行，setTimeout更好用。

令牌过期时如何创建注销

3 个答案: