Apollo客户延迟请求

时间:2018-10-30 08:36:57

标签: react-apollo apollo-client

我对Apollo Client有一个很奇怪的问题。

我们将apollo-client@1.9.3与react(react-apollo@1.4.16)一起使用。 在我们的项目中,我们注意到apollo在发送请求之前总是等待1-2秒。

以下是该情况的屏幕截图:

enter image description here

这是我们客户端配置的样子:

var result = _dbContext.views
             .Where(x => x.Id == id && x.Created  > DateTime.UtcNow.AddHours(-1))
             .OrderBy(x => x.Created)
             .GroupBy(x=> x.Created.Minute}));

然后查询代码是带有react-apollo的

    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,
});

0 个答案:

没有答案