Question

我使用apollo作为客户端，并且在我的应用程序上运行大量查询和变异。我想知道是否可以通过其名称（例如getProduct）来显示我的每个查询/变异，而不是在“网络”标签中全部显示为“图形”？我在《勇敢（铬）》上。

如果我不必单击每个按钮并检查标题或响应以识别此请求所对应的查询或变异，它将使调试更加容易。

以下是当前在我的devtools中显示的方式：

非常感谢！

Answer 1

也许有更好的方法，但是在这里我可以做的最少的代码。

import {
  ApolloClient,
  ApolloLink,
  HttpLink,
  InMemoryCache,
} from '@apollo/client';

const httpLink = new HttpLink({ uri: MY_BASE_URL });

const namedLink = new ApolloLink((operation, forward) => {
  operation.setContext(() => ({
      uri: `${MY_BASE_URL}?${operation.operationName}`,
    })
  );
  return forward ? forward(operation) : null;
});

export const client = new ApolloClient({
  link: ApolloLink.from([namedLink, httpLink]),
  cache: new InMemoryCache(),
});

您必须命名查询：

import { gql } from "@apollo/client";

const QUERY = gql`
  query QueryName {
    ...
  }
`;

希望会有所帮助。

有没有一种方法可以在devtool网络标签中命名graphql请求？

1 个答案: