Разрешение Ax ios на ответ на предполетный запрос, который заставляет связанный GET работать не по порядку с остальной частью приложения - PullRequest
0 голосов
/ 07 января 2020

Добрый день,

Я работаю над приложением React, которое использует React-Redux (с Thunk) и Axe ios.

У меня есть действие, которое я отправляю, которое делает аутентифицированный вызов API. Из-за того, что у меня есть заголовки авторизации в запросе перекрестного источника, существует запрос перед полетом.

Проблема, которая у меня есть, заключается в том, что Ax ios, кажется, выполняет .then () код, как только возвращается предполетный запрос, а не когда возвращается связанный запрос GET. Это приводит к обновлению состояния функции Reducer до того, как возвращаются результаты запроса API GET.

Я добавил несколько console.logs, чтобы дать более подробную информацию для иллюстрации проблемы. Как видите, предварительный запрос отправляется в первой записи. .Hen выполняет один запрос перед полетом, возвращается с 200. Затем действие запускается, и редуктор обновляет состояние. Мое приложение отвечает повторным рендерингом контейнера, который был подключен к Redux. Затем дочерние компоненты также обновляются. Затем запрос GET завершается и возвращается с 200. И в этот момент ничего больше не происходит, потому что редуктор уже был обновлен в предыдущем .then (), упомянутом выше.

Код действия показан ниже. Я не вставил весь другой код, так как есть несколько файлов, и они относительно большие. При необходимости я могу включить их тоже. Network tab details

export const updatePlotDataInit = (datasetName, tableName, xFieldName, 
    yFieldName, chartId, chartType, plotId, newDomainStartDbIndex, newDomainEndDbIndex) => {
        console.log('[actions/plot.js.js] - [updatePlotDataInit] - [start of function]');
    return dispatch => {
        dispatch(updatePlotDataStart());
        console.log('[actions/plot.js.js] - [updatePlotDataInit] - [just before api request]');
        instance.get( // custom axios instance with extra auth header used here
            `/v1/datasets/${datasetName}/tables/${tableName}/fields/data?xField=${xFieldName}&yField=${yFieldName}&chartType=${chartType}&domainStart=${newDomainStartDbIndex}&domainEnd=${newDomainEndDbIndex}`
            )
            .then(response => {
                console.log('[actions/plot.js.js] - [updatePlotDataInit] - [in .then before updatePlotDataSuccess]');
                // dispatch redux action for success case
                const currentLevel = response.data.metaData.current_level 
                const data = response.data.queryData.data //schema is available too
                //datasetId, tableId, xFieldId, xField, yFieldId, yField, chartId, plotIdVal, currentLevel, data
                dispatch( updatePlotDataSuccess( plotId, currentLevel, data ) );
                // console.log(response);
                console.log('[actions/plot.js.js] - [updatePlotDataInit] - [in .then after updatePlotDataSuccess]')
            })
            .catch(error => {
                console.log(error);

            // dispatch redux action for failure case
            dispatch(updatePlotDataFail(error));
            })
    }
};

Я не совсем уверен, но кажется, что Ax ios считает успешный предполётный ответ подходящим для разрешения выпусков ie и, следовательно, затем исполняется.

Кажется ли это так? И если да, то как мне заставить Ax ios ждать, пока GET / POST / PUT / et c завершится успешно, прежде чем выполнить обещание?

Любая помощь приветствуется.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...