GraphQL 学习指南 (18):GraphQL 查询语言 3.1&3.1.1

阅读数:6 2019 年 12 月 18 日 20:43

GraphQL学习指南(18):GraphQL查询语言 3.1&3.1.1

(GraphQL API 工具)

内容简介
为什么 GraphQL 是 Ajax 诞生以来具创新性的数据获取技术?GraphQL 通过为 API 提供查询语言和用以完成查询的运行状态,提供了对 REST 和特定页面服务架构的替代方案。借助这《GraphQL 学习指南》,Alex Banks 和 Eve Porcello 为希望开始使用 GraphQL 的前端 Web 开发人员、后端工程师以及项目或产品经理提供了一条清晰的学习路径。你将先后探索图论、图数据结构和 GraphQL 类型,之后在实际项目中学习如何为照片共享应用构建 schema。
《GraphQL 学习指南》还将向你介绍 Apollo Client,可用来将 GraphQL 连接到你的用户界面。

GraphQL 社区已经开发了几个和 GraphQL API 交互的开源工具。它们可以帮助你通过 GraphQL 查询语言编写查询,发送到 GraphQL 端获取返回的 JSON。下面我们将介绍两种最常用的针对 GraphQL API 的 GraphQL 查询字段测试工具:GraphiQL 和 GraphQL Playground。


(GraphiQL)

GraphiQL 是由 Facebook 创建的浏览器内的集成开发环境(IDE),方便开发人员查询和浏览 GraphQL API。GraphiQL 提供语法高亮显示、代码完成和错误警告,它使你可以在浏览器中直接运行并查看查询结果。许多公共 API 提供了 GraphiQL 接口,你可以使用该接口查询实时数据。

它的操作界面相当简单。在其中编写查询,点击运行按钮便可在右侧面板中看到反馈结果,如图 3-1 所示。

GraphQL学习指南(18):GraphQL查询语言 3.1&3.1.1

图 3-1:GraphiQL 界面

我们的查询流程从使用 GraphQL 查询语言编写的文本开始。我们将此文本称为查询文档。将查询文本写入左侧面板。在 GraphQL 文档中可以定义一个或多个操作,比如查询、变更或是订阅。图 3-2 显示了如何向文档中添加查询操作。

GraphQL学习指南(18):GraphQL查询语言 3.1&3.1.1

图 3-2:GraphiQL 查询

单击播放按钮进行查询。在右侧面板中会将到 JSON 格式的响应结果(见图 3-3)。

GraphQL学习指南(18):GraphQL查询语言 3.1&3.1.1

图 3-3:GraphiQL 查询演示

点击右上角打开 Docs 窗口,这里显示了与当前服务交互所需了解的全部内容。该文档会自动添加到 GraphiQL,因为它是从服务的 schema 中读取的。schema 定义了服务上可用的数据,并且 GraphiQL 通过对 schema 进行自检查询来自动构建文档。在此期间,你始终可以在文档资源管理器中查看它,如图 3-4 所示。

GraphQL学习指南(18):GraphQL查询语言 3.1&3.1.1

图 3-4:GraphiQL 文档资源管理器

通常来说,你是通过 GraphQL 服务主机本身的 URL 来访问 GraphiQL 的,如果你构建自己的 GraphQL 服务,那么可以增加一个路由来渲染 GraphQL 接口,以便你的用户可以浏览公开的数据。当然,你还可以下载独立版本的 GraphiQL。

GraphQL学习指南(18):GraphQL查询语言 3.1&3.1.1

购书地址 https://item.jd.com/12639300.html?dist=jd

评论

发布