使用刷新令牌获取新的访问令牌反应和节点 js

Question

我已经构建了一个 JWT API 用于用户身份验证。我想将它与反应一起使用。我的应用程序有这些路线：

节点 js API 路由：

http://localhost:8080/api/auth/signin -> 此路由接受来自 React 的用户名和密码，并发送回访问令牌以进行反应，并将其保存在本地存储中（我打算改用内存）和包含启用了 httpOnly 的刷新令牌的 cookie。
http://localhost:8080/api/auth/signup -> 此路由将根据用户输入将新用户添加到数据库（与身份验证过程无关）
http://localhost:8080/api/auth/refreshtoken -> 此路由将 return 基于客户端发送的保存在 cookie 中的刷新令牌的新访问令牌。然后客户端将用过期的访问令牌替换它。
http://localhost:8080/api/test/user -> 这将检查用户是否使用来自客户端的访问令牌登录并将用户数据发回

React 客户端路由：

http://localhost:3000/login -> 发送登录用户信息的路由
http://localhost:3000/register -> 创建新用户的路径
http://localhost:3000/user -> 需要用户登录才能查看数据的受保护路由。

当我登录到我的网站时，我可以在访问令牌到期前的 20 秒内看到用户路由中的数据。当访问令牌过期并且我发出新请求时，服务器将使用 401 未经授权的代码进行响应。所以这样我可以确保访问令牌已过期并且我需要使用刷新令牌。我是这样做的：

const API_URL = "http://localhost:8080/api/test/";

const getUserBoard = () => {
  return axios.get(API_URL + "user", { headers: authHeader() })
            .catch((error) => {
              if(error.response.status === 401) {
                // if error response status was 401 then request a new token
                authService.refreshToken();
                window.location.reload();
              }else if(error.response.status === 403) {
                authService.logout();
                window.location.href = "/login";
              }
            });
};

使用刷新令牌获取新访问令牌的代码：

const refreshToken = () => {
  axios({
    url: API_URL + "refreshtoken",
    method: "POST",
    withCredentials: true
  })
    .then((response) => {
      if(response.data.accessToken) {
        const user = JSON.parse(localStorage.getItem("user"));
        user.accessToken = response.data.accessToken;
        localStorage.setItem("user", JSON.stringify(user));
      }
    })
    .catch((error) => {
      console.log("server: " + JSON.stringify(error.response));
    })
}

用于设置 header 以使用访问令牌从服务器接收数据的代码：

export default function authHeader() {
    const user = JSON.parse(localStorage.getItem('user'));
  
    if (user && user.accessToken) {
      // for Node.js Express back-end
      return { 'x-access-token': user.accessToken };
    } else {
      return {};
    }
}

在出现 401 错误时获取新访问令牌的第一部分工作正常，但我的刷新令牌也在 40 秒后过期。如果我发送过期的刷新令牌，它不会 return 一个新的访问令牌。因此，我将再次收到 401 错误，这将再次导致 403 错误，在这里我将陷入无限重新加载循环。

有什么想法吗？我如何控制令牌到期？

Answer 1

您正在 node.js 应用程序中发行令牌，对吧？所以这就是您应该调整令牌的到期时间的地方。发行代币的代码应该有设置过期时间的选项。

请记住，刷新令牌过期后您应该重新登录。您可以实现称为滚动刷新令牌的东西。因此，每当您调用 /api/auth/refreshtoken 端点时，您还可以发出一个新的刷新令牌，具有新的到期时间并 return 它在 cookie 中。

使用刷新令牌获取新的访问令牌反应和节点 js

using refresh token to get new access token react and node js

authentication

node.js

http-status-code-401

jwt

reactjs