Как сделать код синхронным без использования таймаута в промежуточном программном обеспечении React-Redux

Question

Я пытаюсь отправить действие и с помощью промежуточного ПО проверить, не истек ли токен, а если истек, я генерирую новый токен. Затем я использую этот новый токен в API. Проблема в том, что код работает асинхронно. API использует старый токен вместо сгенерированного нового токена. Пожалуйста, помогите мне решить проблему. Примечание. Код промежуточного программного обеспечения находится в файле index.js

this.props.checkToken(oldToken) //action dispatched goes to middleware
apicall(window.sessionSTorage.getItem('token')) //api using token

const mapDispatchToProps = (dispatch) => {
    return {
      checkToken: (token) => dispatch (actionCreators.checkToken(token))
    }
}

export default connect(null, mapDispatchToProps)(myComponent)

Action Creator -

export const checkToken = (token) => {
return {
    type: actionTypes.checkToken,
    token: token,
}}

MIddleware -

//Middleware code here
const logger = store => {
    return next => {
        return action => {
            if (tokenExpired) {
                fetch (url, {
                   method: 'POST',
                   body: JSON.stringify(refresh),
                   headers: {
                      'Content-Type': 'application/json',
                   }
                })
                .then ((response) => response.json())
                .then ((findresponse) => {
                     window.sessionStorage.setItem('token', findresponse.token);
                })
            }

            return next(action);
       }
   }}

Answer 1

Я думаю, что есть много решений для вашего вопроса (отредактируйте промежуточное программное обеспечение или используйте подписку RXJS или создайте другое промежуточное программное обеспечение для обработки токена ...), но я не думаю, что это хорошая практика.Это потому, что нам не нужно отправлять действие на checktoken.

Это должно быть сделано промежуточным программным обеспечением request, которое запускается перед каждым запросом или при изменении пути расположения.Ваше решение также приводит к трудностям при обновлении токена и повторном вызове существующих запросов с новым.

Answer 2

Действие вернет обещание, поэтому вы можете выполнить apicall при успешном выполнении обещания

this.props.checkToken(oldToken).then(()=>apicall(window.sessionSTorage.getItem('token'))

или с использованием async / await

await this.props.checkToken(oldToken) //action dispatched goes to middleware
apicall(window.sessionSTorage.getItem('token')) //api using token