в Apollo-клиенте, как я могу войти или перехватить все операции (запросы и мутации)

Question

В аналитических целях я бы хотел отслеживать на стороне клиента все операции graphql (включая, например, @client).Мне не удалось найти подходящие опции в API, и я подумал, может ли это быть выполнено на уровне клиента apollo или мне нужно ввести какой-нибудь прокси-сервер для перехвата вызовов самостоятельно?

Answer 1

Поскольку ответ Юрия был именно тем, что я искал, я пометил как принятый ответ - Спасибо!

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

Стоит отметить, что ссылки Apollochainable - таким образом, аргументом для функции ссылки являются operation: Operation и forward: NextLink, которые должны вызываться из нашей реализации ссылки.

let analytics: Analytics; // this is Fabric.io Analytics to be provided by DI
const analyticsLink = new ApolloLink((
    operation: Operation,
    forward?: NextLink
) => {
    const operationType = operation.query.definitions[0].operation;
    return forward(operation)
        .map((result: FetchResult) => {
            try {
                analytics.sendCustomEvent(`${operationType}.${operation.operationName}`);
            } catch (e) {
                console.error('analytics error', e);
            }
            return result;
        });
});

в качестве бонуса мы также можем отлавливать ошибки (т.е. использовать структуру.io crashlytics) с использованием apollo-link-error (обработка ошибок в Apollo немного сложнее);

const analyticsErrorLink = onError((error: ErrorResponse) => {
    try {
        // it's worth to rethink what we wanna log here
        const message = error.graphQLErrors ? error.graphQLErrors[0].message :
            (error.networkError.name + ': ' + error.networkError.message);
        analytics.sendNonFatalCrash('GraphQL error: ' + message);
    } catch(e) {
        console.error('cannot report error to analytics', e);
    }
});

Наконец, чтобы составить ссылки, мы должны поместить наши перехватывающие реализации в начале, чтобы мы моглиперехватить все операции GraphQL, в том числе помеченные @client, которые не достигают сетевой ссылки - в моем случае полная ссылка выглядит так:

ApolloLink.from([
    analyticsErrorLink,
    analyticsLink,
    stateLink,
    auth,
    http])

Answer 2

Пользовательская ссылка Apollo - это путь.

Вы можете использовать apollo-link-logger, в частности, для записи всех операций в консоль.

Использование (из документов):

import apolloLogger from 'apollo-link-logger';

// ...
ApolloLink.from([
  apolloLogger,
  // ...
]);

Примечание: Поставьте apolloLogger перед другими ссылками.

Пример вывода: