javascript - GraphQL 使用字段值作为另一个查询的变量

Question

我正在查询同一组件中都需要的 2 个对象。问题是其中一个查询必须等待另一个查询并将其 id 字段用作另一个查询的参数。不确定如何实现。

const PlayerQuery = gql`query PlayerQuery($trackId: Int!, $duration: Int!, $language: String!) {
  subtitle(trackId: $trackId, duration: $duration) {
    id,
    lines {
      text
      time
    }
  }
  translation(trackId: $trackId, language: $language, subtitleId: ???) {
    lines {
      translation
      original
    }
  }
}`;

所以在上面的查询中，translation 需要 subtitleId 作为参数，它由 subtitle 查询返回。
我在客户端和服务器上都使用 Apollo。

Answer 1

这是一个很好的问题，因为它说明了 REST/RPC 风格的 API 和 GraphQL 之间的显着差异。在 REST 风格的 API 中，您返回的对象仅包含有关如何获取更多数据的元数据，并且 API 使用者应该知道如何在这些表上运行 JOIN。在您的示例中，您有一个 subtitle 和一个 translation 需要使用 ID 属性加入。在 GraphQL 中，对象很少孤立存在，关系编码到模式本身。

您没有发布您的schema，但从外观上看，您创建了一个translation 对象和一个subtitle 对象并公开了它们都在您的根查询中。我的猜测是它看起来像这样:

const Translation = new GraphQLObjectType({
  name: "Translation",
  fields: {
    id: { type: GraphQLInt },
    lines: { type: Lines }
  }
});

const SubTitle = new GraphQLObjectType({
  name: "SubTitle",
  fields: {
    lines: { type: Lines }
  }
});

const RootQuery = new GraphQLObjectType({
  name: "RootQuery",
  fields: {
    subtitle: { type: SubTitle },
    translation: { type: Translation }
  }
});

module.exports = new GraphQLSchema({
  query: RootQuery
});

相反，您应该做的是像这样与翻译 INSIDE OF 副标题建立关系。 GraphQL 的目标是首先在数据中创建图形或关系，然后弄清楚如何向该数据公开入口点。 GraphQL 允许您在图中选择任意子树。

const Translation = new GraphQLObjectType({
  name: "Translation",
  fields: {
    id: { type: GraphQLInt },
    lines: { type: Lines }
  }
});

const SubTitle = new GraphQLObjectType({
  name: "SubTitle",
  fields: {
    lines: { type: Lines }
    translations: {
      type: Translation,
      resolve: () => {
        // Inside this resolver you should have access to the id you need
        return { /*...*/ }
      }
    }
  }
});

const RootQuery = new GraphQLObjectType({
  name: "RootQuery",
  fields: {
    subtitle: { type: SubTitle }
  }
});

module.exports = new GraphQLSchema({
  query: RootQuery
});

注意:为了清楚起见，我省略了参数字段和任何其他解析器。我相信您的代码会更复杂一些，我只是想说明这一点 :)。