Question

我在我的react应用程序中使用axios拦截器来传递每个请求的令牌。登录后，我最初调用setupAxiosInterceptors方法（请参见下面的代码）。在刷新浏览器之前，此方法可以很好地工作。

    const registerSucessfulLoginForJwt = (username, token) => {
          sessionStorage.setItem(USER_NAME_SESSION_ATTRIBUTE_NAME, username)
          setupAxiosInterceptors(createJwtAuth(token))    //Calling the axios interceptor at the time of login
    }

请参阅下面的setupAxiosInterceptors方法

const setupAxiosInterceptors = (token) => {
   Axios.interceptors.request.use((config) => {
     if(isUserLoggedIn()) {
        config.headers.authorization = token
        sessionStorage.setItem('authorization', token)
     }
    return config
  })
 }

有人想过如何解决这个问题，使其始终有效吗？

Answer 1

我能够找到解决问题的方法。我创建了一个ApiSetup.js文件，在其中创建了一个可用于所有请求的自定义axios实例。

    const request = axios.create({
        baseURL: API_PATH_BASE
    })

    request.interceptors.request.use(config => {
        const currentUser = AuthenticationService.getLoggedInUser() //You can get the user directly from the cookie or session storage...
        if(currentUser.userName) {
            config.headers.Authorization = currentUser.userToken
        }
    return config
    }, err => {
       console.log(err)
    return Promise.reject(err)
    })

    export default request

Axios请求拦截器不适用于刷新浏览器

1 个答案: