Реакция + редукция + axios + thunk, ожидание перехватчиков. Токен обновления ответа - PullRequest
Новая
       7

Реакция + редукция + axios + thunk, ожидание перехватчиков. Токен обновления ответа

0 голосов
/ 16 марта 2019

Я использовал redux и redux-thunk и использую axios interceptors response для обновления токена, мой код: 

axios.interceptors.response.use(response => {
    return response;
}, error => {
    if (error.response && error.response.data.error === 'token_expired') {
        axios.get('/refresh')
            .then(response => {
                let newToken = response.data.newToken;
                dispatch(refreshToken(newToken))
                error.config.headers.Authorization = 'Bearer ' + newToken;
                console.log(error.config);
                return axios.request(error.config);
            });
    } else {
        return Promise.reject(error);
    }
});

Мой код работает и обновление токена, но действие приращения не ждет axios.interceptors.response и перед повторным запуском обновления токена undefined

Кто я могу это исправить?

Обновление

Я изменяю свой код на: 

axios.interceptors.response.use(response => {
    return response;
}, error => {
    if (error.response && error.response.data.error === 'token_expired') {
        dispatch(getNewToken(newToken => {
            error.config.headers.Authorization = 'Bearer ' + newToken;
            return axios.request(error.config);
        }))
    } else {
        return Promise.reject(error);
    }
});

и getNewToken: 

export const getNewToken = (onSuccess) => {
    return dispatch => {
        axios.get('/refresh')
            .then(response => {
                let newToken = response.data.newToken;
                dispatch(refreshToken(newToken))
                onSuccess(newToken);
            });
    }
}

когда я проверяю браузер веб-разработчика, в сети эта работа и запрос повторяются с новым токеном и работает, но мое действие больше не запускается для выдачи ответа

где моя ошибка?

Update2:

мое промежуточное ПО: 

const jwtTokenRefresh = ({ dispatch, getState }) => (next => (action) => {
    const timeStamp = Math.floor(Date.now() / 1000);
    const expiration = getState().auth.expiration;
    if (expiration && timeStamp > expiration) {

        axios.get('/refresh')
            .then(response => {
                let newToken = response.data.newToken;
                dispatch(refreshToken(newToken))
            })
            .then(() => {
                next(action);
            })
    }else {
        return next(action);
    }
});

и обновить действие токена: 

export const refreshToken = dispatch => {
    return dispatch => {
        axios.get('/refresh')
            .then(response => {
                console.log(response);
                let newToken = response.data.newToken;
                const rememberMe = localStorage.getItem('token') ? true : false;
                dispatch(authSuccess(newToken, rememberMe))
            });
    }
}

1 Ответ

1 голос
/ 16 марта 2019

Вы можете передать установку нового токена в качестве функции обратного вызова для действия refreshToken () и вызывать его, когда refreshToken возвращает результат успеха: 

dispatch(refreshToken((newToken) => {
    error.config.headers.Authorization = 'Bearer ' + newToken;
    console.log(error.config);
    return axios.request(error.config);
  })
)

И refreshToken Действие выглядит как 

refreshToken(onSuccess, onFailure) {
     axios.post('/refreshTokenUrl')
     .then(responseData => {
         const {token} = responseData;
         onSuccess(token);
     })
}
...