reactjs - 防止 Graphiql 控制台发出多个自省查询

Question

我正在使用该Graphiql组件来呈现控制台，并希望通过自省查询获取架构。问题是如果组件在第一个自省查询被解决之前重新渲染（例如打开一个模式），第二个自省查询就会被触发。鉴于这些查询对于后端来说很昂贵，我想避免这种情况。

有没有办法避免多次内省查询？

Answer 1

GraphiQL 组件接受一个schema道具：

schema：一个 GraphQLSchema 实例，或者null如果一个不被使用。如果undefined提供，GraphiQL 将使用 fetcher 发送自省查询以生成模式。

您可以使用getIntrospectionQuery获取完整的自省模式，获取自省结果，然后使用它来构建模式。

const { getIntrospectionQuery, buildClientSchema } = require('graphql')

const response = await fetch('ENDPOINT_URL', {
  method: 'post',
  headers: { 'Content-Type': 'application/json' },
  body: { query: JSON.stringify(getIntrospectionQuery()) },
})
const introspectionResult = await response.json()
const schema = buildClientSchema(introspectionResult.data)

在渲染组件之前执行此操作，然后将模式作为道具传递。如果您的架构不会更改，您也可以将内省结果保存到文件中并使用该文件而不是查询服务器。