Apollo GraphQL tutorial: "GraphQLError: Cannot query field \"id\" on type \"LaunchConnection\"."

Question

我在这一步尝试遵循 Apollo GraphQL 教程，https://www.apollographql.com/docs/tutorial/resolvers/#run-queries-in-the-playground. Following https://github.com/apollographql/fullstack-tutorial，我 运行

cd final/server && npm i && npm start

以及

cd final/client && npm i && npm start

（对于 final/server，我首先在 运行 宁 npm install 之前删除了 package-lock.json 因为我 运行宁陷入 sqlite3依赖）。

但是，在 localhost:4000 上的 GraphQL 游乐场中，如果我尝试 运行 查询

query GetLaunches {
  launches {
    id
    mission {
      name
    }
  }
}

我收到错误响应

{
  "error": {
    "errors": [
      {
        "message": "Cannot query field \"id\" on type \"LaunchConnection\".",
        "locations": [
          {
            "line": 3,
            "column": 5
          }
        ],
        "extensions": {
          "code": "GRAPHQL_VALIDATION_FAILED",
          "exception": {
            "stacktrace": [
              "GraphQLError: Cannot query field \"id\" on type \"LaunchConnection\".",
              "    at Object.Field (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/validation/rules/FieldsOnCorrectType.js:64:31)",
              "    at Object.enter (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/language/visitor.js:334:29)",
              "    at Object.enter (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/language/visitor.js:385:25)",
              "    at visit (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/language/visitor.js:252:26)",
              "    at Object.validate (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/validation/validate.js:63:22)",
              "    at validate (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/apollo-server-core/dist/requestPipeline.js:211:32)",
              "    at Object.<anonymous> (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/apollo-server-core/dist/requestPipeline.js:124:42)",
              "    at Generator.next (<anonymous>)",
              "    at fulfilled (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/apollo-server-core/dist/requestPipeline.js:4:58)",
              "    at processTicksAndRejections (internal/process/task_queues.js:93:5)"
            ]
          }
        }
      },
      {
        "message": "Cannot query field \"mission\" on type \"LaunchConnection\".",
        "locations": [
          {
            "line": 4,
            "column": 5
          }
        ],
        "extensions": {
          "code": "GRAPHQL_VALIDATION_FAILED",
          "exception": {
            "stacktrace": [
              "GraphQLError: Cannot query field \"mission\" on type \"LaunchConnection\".",
              "    at Object.Field (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/validation/rules/FieldsOnCorrectType.js:64:31)",
              "    at Object.enter (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/language/visitor.js:334:29)",
              "    at Object.enter (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/language/visitor.js:385:25)",
              "    at visit (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/language/visitor.js:252:26)",
              "    at Object.validate (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/graphql/validation/validate.js:63:22)",
              "    at validate (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/apollo-server-core/dist/requestPipeline.js:211:32)",
              "    at Object.<anonymous> (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/apollo-server-core/dist/requestPipeline.js:124:42)",
              "    at Generator.next (<anonymous>)",
              "    at fulfilled (/Users/kurt/Documents/Scratch/fullstack-tutorial/final/server/node_modules/apollo-server-core/dist/requestPipeline.js:4:58)",
              "    at processTicksAndRejections (internal/process/task_queues.js:93:5)"
            ]
          }
        }
      }
    ]
  }
}

（见下方截图）。

知道是什么原因造成的吗？我确实在右侧弹出窗口 window 中看到了一个 GraphQL 模式，它似乎包含这些字段：

directive @cacheControl(
  maxAge: Int
  scope: CacheControlScope
) on FIELD_DEFINITION | OBJECT | INTERFACE
enum CacheControlScope {
  PUBLIC
  PRIVATE
}

type Launch {
  id: ID!
  site: String
  mission: Mission
  rocket: Rocket
  isBooked: Boolean!
}

type LaunchConnection {
  cursor: String!
  hasMore: Boolean!
  launches: [Launch]!
}

type Mission {
  name: String
  missionPatch(size: PatchSize): String
}

type Mutation {
  bookTrips(launchIds: [ID]!): TripUpdateResponse!
  cancelTrip(launchId: ID!): TripUpdateResponse!
  login(email: String): String
}

enum PatchSize {
  SMALL
  LARGE
}

type Query {
  launches(
    pageSize: Int
    after: String
  ): LaunchConnection!
  launch(id: ID!): Launch
  me: User
}

type Rocket {
  id: ID!
  name: String
  type: String
}

type TripUpdateResponse {
  success: Boolean!
  message: String
  launches: [Launch]
}

scalar Upload

type User {
  id: ID!
  email: String!
  trips: [Launch]!
}

Answer 1

查看您提供的架构，查询 launches returns 类型 LaunchConnection

type LaunchConnection {
  cursor: String!
  hasMore: Boolean!
  launches: [Launch]!
}

type Query {
  launches: LaunchConnection!
}

您在下面的查询预计 return 类型 LaunchConnection

query GetLaunches {
  launches {
    id
    mission {
      name
    }
  }
}

但是 LaunchConnection 有字段 cursor、hasMore 和 launches。您要求的字段 id & mission 类型不正确。您应该首先深入研究 LaunchConnection 上的 launches 字段，然后您可以请求 Launch 类型的字段。您的查询应如下所示：

query GetLaunches {
    launches {
        launches {
            id
            mission {
                name
            }
        }
    }
}