GraphQL动态查询生成

Question

我有一个GraphQL服务器，它能够为指定源提供timeseries数据（例如，传感器数据）。获取传感器数据的示例查询可能是：

query fetchData {
    timeseriesData(sourceId: "source1") {
      data {
        time
        value
      }
    }
}

在我的前端，我想允许用户选择一个或多个源，并显示一个图表，每一个都有一行。通过使用下面这样的查询,似乎可以实现以下操作：

query fetchData {
    series1: timeseriesData(sourceId: "source1") {
      data {
        time
        value
      }
    }
    series2: timeseriesData(sourceId: "source2") {
      data {
        time
        value
      }
    }
}

大多数GraphQL教程似乎关注于静态查询（例如，唯一改变的是变量，而不是请求的实际形状）--但在我的例子中，我需要查询本身是动态的（为我选择的每个ID提供一个timeseriesData请求）。

1. 修改服务器的架构不是一个选项（例如，因此我不能将ID数组传递给解析器）
2. 我的查询是使用模板字符串指定的，例如GQL`...`
3. 我不想手动将查询构建为字符串，因为这似乎会导致灾难，并意味着我将失去所有工具的优点（例如自动完成、语法高亮显示、链接）

我使用的堆栈是：

• Apollo客户端（特别是apollo-angular）
• 角度
• 打字
• graphql-tag（用于定义查询）

Answer 1

您可以使用片段定义公共字段，并将变量绑定在该片段上@include(if:Boolean)和@skip(if:Boolean)指令，以获取在执行时已知的动态字段。

根据spec，最好避免手动字符串插值来构造动态查询。

指令¹允许包含或跳过基于作为查询变量传递的布尔表达式的字段。指令可以附加到字段或片段包含，并且可以以服务器希望的任何方式影响查询的执行。

query Hero($episode: Episode, $withFriends: Boolean!) {
  hero(episode: $episode) {
    name
    friends @include(if: $withFriends) {
      name
    }
  }
}

{
  "episode": "JEDI",
  "withFriends": false
}