注销用户并删除 useSWR 调用的所有请求

问题描述

我对 axios 和拦截器进行了身份验证，但在用户注销时遇到了问题。

当 accesstoken 失效时，我使用 refreshToken 调用 revalidate。什至刷新令牌无效时我想注销用户，但我不确定如何停止/清除使用 axios fetcher 的 useSWR 在应用程序中触发的所有请求。

这样做的最佳做法是什么？

const initAxios = onAuthFinish => {
  axios.interceptors.request.use(
    config => {
      const accesstoken = Cookies.get(authKeys.accesstoken)
      const tokenType = Cookies.get(authKeys.tokehType)
      if (accesstoken) {
        config.headers.Authorization = `${tokenType} ${accesstoken}`
      }
      return config
    }
  )

  let isRefreshing = false
  const refreshSubscribers = []

  const subscribetokenRefresh = (resolve,reject) => {
    refreshSubscribers.push({resolve,reject})
  }

  const onRrefreshed = token => {
    while (refreshSubscribers.length > 0) {
      const {resolve} = refreshSubscribers.pop()
      resolve(token)
    }
  }

  const onExpired = () => {
    while (refreshSubscribers.length > 0) {
      const {reject} = refreshSubscribers.pop()
      reject()
    }
  }

  axios.interceptors.response.use(
    response => response,error => {
      const originalRequest = error.config

      if (error.response.status === 403) {
        // refresh token is invalid - WHAT TO DO HERE?
        removeAuthData()
        onAuthFinish()
        return Promise.reject(error)
      }

      if (error.response.status === 401) {
        if (!isRefreshing) {
          isRefreshing = true
          userApi.refreshLogin(Cookies.get(authKeys.refreshToken)).then(res => {
            isRefreshing = false
            if (res && res.data) {
              setAuthData(res.data)
              const newToken = `${Cookies.get(authKeys.tokehType)} ${Cookies.get(authKeys.accesstoken)}`
              axios.defaults.headers.common.Authorization = newToken
              onRrefreshed(newToken)
            }
          }).catch(err => {
            isRefreshing = false
            onExpired()
            // this is caused by reject in 403 status if block - WHAT TO DO HERE?
          })
        }

        const retryOrigReq = new Promise((resolve,reject) => {
          subscribetokenRefresh(token => {
            originalRequest.headers.Authorization = token
            resolve(axios(originalRequest))
          },() => {
            originalRequest._retry = false
            reject(axios(originalRequest))
          })
        })
        return retryOrigReq
      }

      return Promise.reject(error)
    },)
} 

目前，我使用 onExpired 对所有触发的请求调用拒绝 - 但这仍会缓存所有请求，因此在用户重新登录后，仍有以前的数据。如果我不拒绝那个请求，它就会卡在加载中。

我也尝试从 cache.clear()

调用 import {cache} from 'swr'

解决方法

似乎最好的解决方案就是清除 cookie 并调用重定向：

    removeAuthData()
    window.location.href = '/login/'