概述
让我们将我们的房源数据与过去客人的评论结合起来。使用GraphOS，这非常简单：我们只需点击几下即可！
在本课中，我们将
- 添加一个新的 子图 到我们的 超级图 中，使用 Studio
- 检查一个 操作 的 查询计划
介绍评论
我们即将了解评论 API；它是另一个功能齐全的 GraphQL 服务器，具有架构、数据源 和数据提取器。
该reviews 服务收集并提供来自客人的反馈。我们可以 查询 它以获取其数据库中的所有评论，或提交新的评论。
让我们欢迎这个 子图 和全新的功能进入我们的 GraphQL API——我们可以通过克隆存储库并立即报告其架构来实现。无需任何调整！
克隆 reviews
在你的终端中，导航出 listings 目录，以便你位于主 odyssey-federation-typescript 项目文件夹中。然后，运行以下命令克隆 reviews 子图。
git clone https://github.com/apollographql-education/odyssey-federation-ts-reviews.git reviews
注意： 我们在上面的命令中附加了一个额外的 reviews 标志。这将以名为 reviews 的文件夹克隆提供的存储库，以确保清晰度。
现在我们的项目结构如下
📦 odyssey-federation-typescript┣ 📂 listings┣ 📂 reviews┗ 📂 router
让我们打开 reviews。我们将运行以下命令。
首先，安装我们的依赖项
npm install
接下来，启动服务器
npm run dev
添加子图
让我们将我们的 reviews 架构发布到注册表。
复制下面的命令，将 你的 值替换为 APOLLO_GRAPH_REF。然后，在打开到 reviews 目录的终端中，粘贴并运行它。
rover subgraph publish <APOLLO_GRAPH_REF> \--name reviews \--schema ./src/schema.graphql \--routing-url https://127.0.0.1:4001
注意： 该 listings 子图 在本地端口 4000 上运行，而 reviews 子图 在 4001 上运行。请确保当你发布 reviews 架构时，引用了正确的端口号！
现在让我们返回 Studio，并导航到左侧菜单中的 子图 选项卡。我们会看到我们的新 reviews 子图 已被报告——而且我们的 超级图 已扩展！
我们的新超级图架构
接下来，让我们通过导航菜单查看 变更日志，看看 reviews 子图 为 API 添加了哪些新功能和功能。
我们可以看到我们的 图 已扩展——包含所有关于评论的类型和 字段！我们有两个新的 对象类型：Review 和 SubmitReviewResponse。我们还有 ReviewInput 作为新的输入类型。并且我们有两个新的根 字段：Query.allReviews 和 Mutation.submitReview。
所有这些新类型和 字段 都可能来自 reviews 子图。我们可以通过转到 架构 页面来确认哪些 字段 来自哪个子图。
在 参考 选项卡下，选择 查询，我们可以看到我们 超级图 的入口点。 子图 列表示每个 字段 来自哪个 子图！
在这里我们会看到新的 字段 是 reviews 子图 贡献的：allReviews。
我们还可以查看在 对象 下添加到我们架构中的新 对象类型。
我们的 超级图 已正式扩展！
发送查询
评论和房源的数据都在我们的指尖；你是否迫不及待地想要测试我们 超级图 的强大功能？让我们尝试发送一个涉及两个 子图 的 查询。
让我们回到 查询 选项卡，位于 架构 页面中，我们可以看到我们 超级图 的所有可用入口点。在 架构 页面中的 操作 列中，点击 allReviews 旁边的播放图标 字段。
这将在 Explorer 中打开文档选项卡，显示该 字段 以及我们可以用来构建 查询 的内容。
注意： 如果你在 操作 面板中当前有一个 操作，请清除它或打开一个新的 Explorer 选项卡。我们想从这里开始！
在 allReviews 下，我们可以看到它的描述——"数据库中所有评论的列表"——以及每个返回的 Review 类型上可用于 查询 的 字段。让我们添加它们：id、text 和 rating。
query GetAllReviews {allReviews {idtextrating}}
这些数据来自 reviews 子图！现在让我们从 listings 子图 中提取数据：为什么不提取特定房源的数据呢？
在 Explorer 中有一个方便的快捷方式来搜索我们的模式以查找该 字段。按下 Command + K 或 Ctrl + K 访问聚光灯搜索。开始输入 listing，该 Query.listing 字段 应该会弹出。
让我们添加 listing 字段 并请求其 title。
最后，我们将重命名该 操作 使其更明确。将其命名为 GetAllReviewsAndListing。
您的 查询 现在应该看起来像这样：
query GetAllReviewsAndListing($listingId: ID!) {allReviews {idtextrating}listing(id: $listingId) {title}}
在 变量 部分：
{"listingId": "listing-1"}
让我们运行它！
哇哦，我们拿到了数据！一个查询，但数据来自两个独立的子图 🤯🎉
查询计划
我们可以通过检查 查询计划 来验证每个 字段 的数据来自哪里。该 查询计划 就像一个 操作 的蓝图：该 路由器 使用的一组指令，用于将较小的操作发送到负责这些特定 字段 的 子图。
单击 响应 面板中的下拉菜单，然后选择 查询计划。
我们可以将 查询计划 视为图表，或者如果我们选择 “将计划显示为文本” 图标，则可以将其视为文本。我们不必过多关注 查询计划 语法 - 该 路由器 知道发生了什么！但当我们开始涉及更多 子图 以及需要优化的更复杂的查询时，这将非常有用。
对于这个特定的 查询，我们可以看到“并行”一词，表明该 路由器 可以同时发出两个独立的请求：一个到 reviews，另一个到 listings。这些请求可以并行运行，因为 listings 和 reviews 都不需要依赖对方来解析自己的数据。
我们还可以看到 allReviews 字段 及其子字段来自 reviews 子图 （即 Fetch(service: "reviews") 部分），而 listing 字段 及其子字段来自 listings 子图。这两个较小的 操作 并行运行，并由它们自己的子图解析，该 路由器 负责将数据捆绑在一起，以单个响应形式返回给客户端。
添加一个 子图 很简单！但您可能觉得两个子图中的数据仍然是分离的和孤立的。没有任何东西直接 连接 房源和评论或反之。
新功能：房源的评分和评论
我们希望能够针对特定房源进行 查询，以获取有关该房源的详细信息：其标题、描述、床位数和便利设施，以及为其撰写的评论！让我们更进一步 - 让我们还包括房源的 overallRating，该评分由所有评分汇总计算得出。
这是梦想 查询 的样子：
query GetListingAndReviews {listing(id: "listing-1") {titledescriptionnumOfBedsamenities {namecategory}overallRatingreviews {idtext}}}
注意：我们在此将房源的 id 与 查询 内联在一起，以便在我们学习过程中方便引用。实际上，该 id 参数 将被提取到一个 变量 中。
让我们深入到我们的 reviews 数据中，看看如何将此功能整合在一起，并实现我们的梦想 查询。
数据位于 reviews 中
当我们启动 reviews 服务器时，它会自动在其内存数据库中播种一些示例评论。
评论表定义了四列： id、 text、 rating 和 listingId。以下是将这些数据汇总在一起的表格。
| id | text | rating | listingId |
|---|---|---|---|
| 1 | "哇，真是太棒了！我以前从未住过洞穴，所以准备不足。幸运的是，这个房源拥有我需要的各种设施，让我感到安全和准备充足，可以应对任何情况。" | 4 | "listing-1" |
| 2 | "我 100% 享受了荒野体验。如果您不是探险家和户外爱好者，请勿预订。" | 5 | "listing-2" |
| 3 | "一般般，说实话可以更好。我期待更多。湖泊是唯一好的地方。" | 2 | "listing-3" |
该 listingId 字段 正是我们需要关联特定评论与其所针对房源的字段。
只有一个问题：除了数据库中的这列之外，我们的 reviews 子图 根本不知道 什么 是“房源”。同样，我们的 listings 子图 也不了解 reviews！即使它们是同一 超图 的一部分，每个 子图 都生活在自己的世界中。
我们需要一种方法来连接两个 子图 之间的数据，以使我们的梦想 查询 能够正常工作（提示：这叫做实体！）。这将涉及对我们的两个子图进行一些更改，因此我们将首先设置正确的 超图 开发环境。这将确保我们对一个子图所做的任何更改不仅按预期工作，而且还能与另一个子图良好配合。
练习
关键要点
- 要添加一个新的 子图，我们可以使用 Studio UI 或 Rover CLI。
- 我们可以查看 路由器的 查询计划 使用 Explorer。
接下来
让我们在下一课中为本地开发做好准备。
分享您对此课程的疑问和评论
本课程目前处于
您需要一个 GitHub 帐户才能在下面发帖。还没有吗？ 改在 Odyssey 论坛发帖。