如何实现无感刷新token?

264 阅读2分钟

"```markdown 实现无感刷新Token 无感刷新Token是通过在用户使用旧Token访问服务端时,服务端验证Token是否过期,如果过期,则返回一个新的Token给用户,用户无需重新登录即可继续访问服务。

实现无感刷新Token的方式通常是使用Refresh Token机制。Refresh Token是一种长期有效的Token,用于获取新的Access Token。当用户的Access Token过期时,可以使用Refresh Token来获取新的Access Token,而无需重新登录。

以下是实现无感刷新Token的一般步骤:

  1. 客户端在登录成功后,从服务端获取Access Token和Refresh Token,并保存在本地。
  2. 客户端在每次请求需要鉴权的接口时,携带Access Token进行访问。
  3. 当服务端验证Access Token过期时,返回特定的状态码,比如401 Unauthorized。
  4. 客户端收到401状态码后,使用Refresh Token向服务端请求新的Access Token。
  5. 服务端验证Refresh Token的有效性,如果有效,则生成新的Access Token并返回给客户端。
  6. 客户端收到新的Access Token后,重新发起原始请求,携带新的Access Token进行访问。

下面是一个简单的示例代码,演示了如何在前端使用Refresh Token实现无感刷新Token:

// 登录成功后获取Access Token和Refresh Token
function login(username, password) {
  // 发起登录请求,获取Access Token和Refresh Token
}

// 发起需要鉴权的请求
function fetchData(url, accessToken) {
  // 发起请求,携带Access Token
}

// 当服务端返回401状态码时,使用Refresh Token获取新的Access Token
function refreshAccessToken(refreshToken) {
  // 发起请求,使用Refresh Token获取新的Access Token
}

// 在请求拦截器中,自动携带Access Token进行请求
axios.interceptors.request.use(
  (config) => {
    const accessToken = getAccessToken();
    if (accessToken) {
      config.headers.Authorization = `Bearer ${accessToken}`;
    }
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

// 在响应拦截器中,处理401状态码,使用Refresh Token获取新的Access Token
axios.interceptors.response.use(
  (response) => {
    return response;
  },
  (error) => {
    if (error.response.status === 401) {
      const refreshToken = getRefreshToken();
      if (refreshToken) {
        return refreshAccessToken(refreshToken).then((newAccessToken) => {
          // 保存新的Access Token
          saveAccessToken(newAccessToken);
          // 重新发起原始请求
          const originalRequest = error.config;
          originalRequest.headers.Authorization = `Bearer ${newAccessToken}`;
          return axios(originalRequest);
        });
      } else {
        // 跳转到登录页面
      }
    }
    return Promise.reject(error);
  }
);

通过上述实现,客户端可以在Access Token过期时,使用Refresh Token获取新的Access Token,从而实现了无感刷新Token的效果。