graphql - 当所有请求都具有相同的 URL 时，如何在开发工具网络选项卡中区分 GraphQL 请求？

Question

当所有请求都具有相同的 URL 时，如何在开发工具网络选项卡中区分 GraphQL 请求？

我所有的请求都针对 /api/graphql所以要区分它们，我需要单击每个，切换到“标题”选项卡，向下滚动到“请求有效负载”部分并阅读查询。这意味着我在请求中几乎看不到任何概览，因此在找到我想要检查的请求之前，我必须单击多个请求。

人们如何解决这个问题？

Answer 1

我正在使用 Apollo，我在这里找到了一些相关信息:
https://github.com/apollographql/apollo-link/issues/264
我采用的解决方案是这个查询参数(服务器端未使用):

const customFetch = (uri, options) => {
  const { operationName } = JSON.parse(options.body);
  return fetch(`${uri}/graphql?op=${operationName}`, options);
};

const link = createHttpLink({ fetch: customFetch });

这个解决方案可以很容易地适应其他 gql 客户端库。