Это синхронный запрос?

Question

Я использую Axios в редуксе. И мне интересно, вот мой вызов API с Axios. Это синхронно работает? если нет, то как я могу сделать это синхронно?

return (dispatch) => {
  dispatch({
    type: FETCH_ALLDRIVER_DATA_START
  })

  return axios.post(baseUrl + 'v1/drivers/alldriver', {
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      }
    })
    .then(response => {
      console.log('jj')
      console.log(response)
    })
    .catch(error => {
      throw (error);
    });
};

Answer 1

Если вам нужно завершить запрос перед вызовом функции dispatch, вы можете вызвать его в обратном вызове разрешения обещания (then) следующим образом:

return (dispatch) => {
    return axios.post(baseUrl + 'v1/drivers/alldriver', {
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      }
    })
    .then(response => {
      console.log('jj')
      console.log(response)
      // here call whatever you want to do after a succesful request
      dispatch({
          type: FETCH_ALLDRIVER_DATA_START
      })
    })
    .catch(error => {
      throw (error);
    });
};

Имейте в виду, чтоэто все еще асинхронный вызов, но с кодом beign, выполненным после успешного завершения запроса.

Если вы действительно хотите сделать синхронизирующий вызов, используйте async и await, например, так:

return async (dispatch) => {
    const response = await axios.post(baseUrl + 'v1/drivers/alldriver', {
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      }
    });

    dispatch({
        type: FETCH_ALLDRIVER_DATA_START
    })
};

Хотя я не знаю, как redux будет вести себя с синхронизирующим вызовом.

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

Надеюсь, это поможет.

Answer 2

axios.post(...).then(...) - это обещание асинхронное.Я думаю, что с axios вы не можете сделать его синхронным: Как сделать синхронные оси

В идеале, с помощью redux, я бы использовал redux-thunk для выполнения асинхронных вызовов.

Синхронные вызовы заставят основной поток приостановить работу (что делает всю страницу не отвечающей) до получения ответа (представьте, что клиенты на медленных соединениях), что плохо для пользователя.Я не уверен, почему вы хотите сделать это синхронно, но если вам действительно нужно, попробуйте использовать XMLHttpRequest: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests#Synchronous_request