首页 > 解决方案 > 如何使用现有变量构建 Graqhql 突变

问题描述

这可能看起来像一个奇怪的问题,或者非常简单的问题,但老实说,我正在努力弄清楚如何做到这一点。我在 Node.js 中工作,我想将保存在节点对象上的数据设置到我的 GraphQL 突变中。

我正在使用供应商的 GraqhQL API,所以这不是我自己创建的,我也没有它的架构文件。我正在构建一个突变,它将在他们的应用程序中插入一条记录,我可以手动写出所有内容并使用 Postman 之类的工具手动创建新记录……突变的结构不是我的问题。

我正在努力弄清楚的是如何使用来自我的节点对象的变量来构建突变,而不仅仅是将一堆字符串放在一起。

例如,这是我试图避免的:

class MyClass {
  constructor() {
    this.username = "my_username"
    this.title = "Some Title"
  }
}

const obj = new MyClass()

let query = "mutation {
  createEntry( input: {
    author: { username: \"" + obj.username + "\" } 
    title: \"" + obj.title + "\"
  })
}"

我注意到有许多不同的节点包可用于使用 Graphql,但我所见过的他们的文档都没有真正解决上述情况。我的谷歌搜索尝试完全不成功,有人可以指出我正确的方向吗?是否有一个包可用于仅构建查询而不需要模式或尝试同时发送它们?

标签: node.jsgraphql

解决方案


GraphQL 服务通常在使用 HTTP 作为传输时实现此规范。这意味着您可以使用四个参数构造一个 POST 请求:

  • query - 包含要执行的 GraphQL 操作和片段的文档。
  • operationName -(可选):文档中要执行的操作的名称。
  • variables -(可选):操作定义的任何变量的值。
  • extensions -(可选):此条目保留给实现者以他们认为合适的方式扩展协议。

您可以使用节点友好的fetch版本,如cross-fetch、或您选择的任何其他库来发出实际的 HTTP 请求。axiosrequest

如果您有要在查询中替换的动态值,则应使用变量来执行此操作。变量在文档顶部定义为操作定义的一部分:

const query = `
mutation ($input: SomeInputObjectType!) {
  createEntry(input: $input) {
    # whatever other fields assuming the createEntry
    # returns an object and not a scalar
  }
}
`

请注意,您使用的类型将取决于input参数指定的类型——替换SomeInputObjectType为适当的类型名称。如果供应商没有为他们的服务提供足够的文档,您至少应该可以访问 GraphiQL 或 GraphQL Playground 实例,您可以在其中查找参数的类型。否则,您可以使用任何通用 GraphQL 客户端(如 Altair)并以这种方式查看架构。

构建查询后,发出如下请求:

const variables = {
  input: {
    title: obj.title,
    ...
  }
}
 
const response = await fetch(YOUR_GRAPHQL_ENDPOINT, {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ query, variables }),
})
const { data, errors } = await response.json()

推荐阅读