Клиент Apollo задерживает запрос - PullRequest
Новая
       21

Клиент Apollo задерживает запрос

0 голосов
/ 30 октября 2018

У меня очень странная проблема с клиентом Apollo.

Мы используем apollo-client@1.9.3 с реагировать (react-apollo@1.4.16). В нашем проекте мы замечаем, что apollo всегда ждет 1-2 секунды перед отправкой запроса.

Ниже приведен скриншот ситуации:

enter image description here

Вот так выглядит наш клиентский конфиг: 

    const customNetworkInterface = {
    query: request =>
        fetch('/graphql', {
            method: 'POST',
            credentials: 'include',
            mode: 'cors',
            cache: 'default',

            headers: {
                Accept: '*/*',
                'Content-Type': 'application/json',
                'X-Requested-With': 'XMLHttpRequest',
            },
            body: JSON.stringify({
                ...request,
                query: print(request.query),
            }),
        })
            .then(resp => resp.json())
            .then(({ data, errors }) => {
                if (errors) {
                    const userErrors = errors
                        .filter(({ code }) => +code >= 400 && +code <= 401)
                        .map(({ message }) => message)
                        .join('\n');
                    const serverErrors = errors
                        .filter(
                            ({ code }) => !code || (+code < 400 && +code > 401)
                        )
                        .map(({ message }) => message)
                        .join('\n');
                    if (serverErrors.length > 0) {
                        error(serverErrors);
                        if (isProduction) {
                            window.triggerAlert(
                                'danger',
                                'The server encountered an error. Our technical team has been notified.'
                            );
                        } else {
                            window.triggerAlert('danger', serverErrors);
                        }
                    } else if (userErrors.length > 0) {
                        window.triggerAlert('danger', userErrors);
                    }
                }

                return { data, errors };
            }),
};

const networkInterface = createNetworkInterface({
    uri: '/graphql',
    opts: {
        credentials: 'same-origin',
    },
});
networkInterface.useAfter([
    {
        applyAfterware({ response }, next) {
            response
                .clone()
                .json()
                .then(responseJson => {
                    if (responseJson.errors) {
                        error(
                            responseJson.errors
                                .map(({ message }) => message)
                                .join('\n')
                        );
                    }
                    next();
                });
        },
    },
]);

export const client = new ApolloClient({
    networkInterface: customNetworkInterface,
    queryDeduplication: true,
    addTypename: true,
});

Тогда код запроса с реагировать-apollo: 

graphql(RaceResultsQuery, {
    props: ({ ownProps, data }) => ({
        race_results: _.get(data, 'me.my_race_results', []),
    }),
}),
...