GraphQL 初学者教程:什么是 GraphQL、功能和示例

什么是 GraphQL?

GraphQL 是 Facebook 开发的一种应用层服务器端技术,用于使用现有数据执行查询。GraphQL 可以优化 RESTful API 调用。它提供了一种获取和更新数据的声明式方法。GraphQL 可帮助您将数据从服务器加载到客户端。它使程序员能够选择他们喜欢的请求类型。

为什么使用 GraphQL?

以下是使用 GraphQL 的原因:

  • 它提供了人类可读的查询。
  • 在 GraphQL 中,处理许多数据库非常容易。
  • 它适用于微服务和复杂系统。
  • 您可以通过单个 API 调用来获取数据。
  • 它可以帮助您进行查询批处理和缓存。
  • 您不会遇到获取过多或不足的问题。
  • 根据您的需要定制请求。
  • 它可以帮助您发现适当格式的模式。
  • GraphQL 会自动保持文档与 API 更改同步。
  • API 的演变无需版本控制。
  • GraphQL 字段用于多个查询,可以共享到更高的组件级别以供重用。
  • 您可以选择要公开的功能以及它们的工作方式。
  • 它可用于快速应用原型设计。

GraphQL 的应用

以下是 GraphQL 的重要应用:

  • 它提供 Relay 和其他客户端框架
  • GraphQL 帮助您提高移动应用程序的性能。
  • 它可以减少过度获取问题,从而降低服务器端云服务并降低客户端的网络使用率。
  • 当客户端应用程序必须指定长查询格式中需要哪些字段时可以使用它。
  • 当您必须向旧的或现有的 API 添加功能时,可以充分利用 GraphQL。
  • 当您必须简化复杂的 API 时使用它。
  • 混合并混搭外观模式,这在面向对象编程中很常用。
  • 当您必须将来自多个地方的数据聚合到一个方便的 API 中时。
  • 您可以使用 GraphQL 作为现有 API 的抽象,以根据用户需求指定响应结构。

学习 GraphQl 之前需要学习什么?

本 GraphQL 教程基于 快捷配送节点。因此,只要对 NodeJS 有基本的了解,你就可以非常轻松地学习 GraphQL。

GraphQL 关键组件

现在,在本 GraphQL 教程中,让我们学习 GraphQL 的关键组件:

GraphQL 关键组件
GraphQL 关键组件

如上图所示,GraphQL 有三个关键组件:1)Query,2)Resolver,3)Schema。

询问

查询是客户端计算机应用程序发出的 API 请求。它支持扩充和指向数组。查询用于读取或获取值。

查询部分:

以下是查询的重要部分

  1. 领域:

字段仅表示我们正在向服务器请求特定信息。以下是 GraphQL 查询中字段的 GraphQL 示例。

query {
    team {
        id name
    }
}

"data": {
    "team":[ {
        "id": 1, 
        "name": "Avengers"
    }
    ,
    …
]
}
}

在上面的 GraphQL 示例中,我们向服务器请求名为 team 的字段及其子字段(如 id 和 name)。GraphQL 服务器返回我们请求的数据。

  1. 参数

In REST的,我们只能传递一组参数作为 URL 段和查询参数。要获取特定配置文件,典型的 REST 调用将如下所示:

GET /api'team?id=2 Content-Type: application JSON
 {
    "id": 2, 
    "name": "Justice League."
}

解决

解析器提供了将 GraphQL 操作转换为数据的方向。它们通过定义解析器函数将查询解析为数据。

它向服务器显示根据特定字段获取数据的流程和位置。解析器还将数据库架构和 API 架构分开。分离的信息有助于修改从数据库获取的内容。

架构

GraphQL 模式是 GraphQL 实现的核心。它描述了连接到它的客户端可用的功能。

GraphQL 的功能

以下是 GraphQL 的重要特性:

  • 它提供声明性查询语言,这不是命令式的。
  • 它是分层的并且以产品为中心。
  • GraphQL 是强类型的。这意味着查询是在特定系统的上下文中执行的。
  • GraphQL 中的查询在客户端中编码,而不是在服务器中编码。
  • 它具有OSI模型应用层的所有功能。

GraphQL 客户端

GraphQL 客户端是向相关 GraphQL 服务器发出 POST 请求的代码。您可以直接查询 GraphQL API,但更好的方法是利用 Relay 的专用客户端库。

本篇 Java脚本库由 Facebook 开发,用于使用 GraphQL 制作 React 应用程序。GraphQL 客户端可以是 Drupal 之类的 CMS、单页应用程序、移动应用程序等。

GraphQL 服务器

GraphQL 服务器是 GraphQL 规范的服务器端实现。它将您的数据描述为 GraphQL API,您的客户端程序可以查询 数据库.

GraphQL 网关

网关是一种微服务模式,您可以在其中构建单独的服务来应对其他后端服务。它提供了可行的文档,并提供了一种通过单个请求从多个来源收集数据的便捷方法。

GraphQL 中的变量是什么?

A GraphQL 中的变量 用于将动态值与客户端查询分开,并将查询作为唯一字典传递。GraphQL 中的变量还可用于重用客户端使用单独参数编写的查询或突变。在 graphQL 中,您不能直接在查询字符串中传递动态参数。原因是客户端代码需要在运行程序时动态操作查询字符串。

GraphQL 有一种很好的方法可以将查询中的动态值分解出来。它将它们作为单独的字典传递。这些值称为变量。每当我们使用变量时,我们都需要做以下三件事:

  1. 用变量名替换查询中的静态值。
  2. 将变量名声明为 GraphQL 查询接受的变量之一。
  3. 在传输特定的变量字典中传递值。

总体来说,如下所示:

query HeroNameAndFriends($episode: Episode) {
  hero(episode: $episode) {
    name
    friends {
      name
    }
  }
}
{
  "episode": "JEDI"
}
{
  "data": {
    "hero": {
      "name": "R2-D2",
      "friends": [
        {
          "name": "Luke Skywalker"
        },
        {
          "name": "Han Solo"
        },
        {
          "name": "Leia Organa"
        }
      ]
    }
  }
}

正如您在上面的 GraphQL 示例中看到的,除了需要构建新的查询之外,我们只是传递了一个不同的变量。

什么是突变?

突变是一种在 GraphQL 中更改数据集的方法。它修改数据存储中的数据并返回一个值。突变可帮助您插入、更新或删除数据。通常,突变被定义为架构部分。

设计 GraphQL 突变时需要考虑的要点

以下是设计 GraphQL 时的重要点:

  • 命名: 首先,您必须为突变命名动词。然后是名词,或“对象”(如果适用)。命名突变时使用驼峰式命名法。
  • 特异性: 您必须尽可能使变更具有针对性。变更应该代表用户采取的语义操作。
  • 输入对象: 使用一个唯一的、必需的输入对象类型作为在客户端执行变异的参数。
  • 唯一有效载荷类型: 您应该为每个突变使用唯一的有效负载类型。您还可以将突变输出作为字段添加到该特定有效负载类型。
  • 嵌套: 在任何有意义的地方对突变使用嵌套。它允许您充分利用 GraphQL API。

GraphQL 和 REST 之间的区别

下表显示了之间的重要区别 GraphQL 和 REST.

GraphQL REST的
它遵循客户端驱动的架构。 它遵循服务器驱动的架构。
GraphQL 可以按照模式来组织。 REST 可以根据端点来组织。
GraphQL 是一个正在不断发展的社区。 REST 是一个非常大的社区。
GraphQL 中的开发速度很快。 REST 中的开发速度较慢。
GraphQL 的学习曲线很困难。 REST 的学习曲线适中。
身份和你获取身份的方式是分开的。 您在 REST 中调用的端点是特定对象的身份。
在 GraphQL 中,服务器确定可用资源。 在 REST 中,资源的形状和大小由服务器决定。
GraphQL 在所有平台上提供高度一致性。 在所有平台上保持一致性非常困难。

GraphQL 的缺点

以下是 GraphQL 的缺点:

  • 年轻的生态系统
  • 后端资源不足。
  • 缺少复杂应用程序的设计模式。
  • 复杂查询的性能问题。
  • 对于小型应用程序来说有点过分了
  • GraphQL 不依赖于能够存储请求内容的 HTTP 缓存方法。
  • GraphQL 不理解文件。因此,它不包含文件上传功能。
  • 使用 GraphQL,需要做好大量的开发前教育准备,例如学习模式定义语言。

GraphQL 使用的开源应用程序和工具

GraphQL 使用的重要开源应用程序和工具如下:

  • 盖茨比:Gastby 是一款由 GraphQL 提供支持的应用程序,可以使用来自多个 GraphQL API 源的数据。您可以使用它来开发静态和基于客户端的 React 应用程序。
  • 图形语言: 它是一个与浏览器集成的 ID,也可以与 GraphQL 的 API 交互。GraphiQL 包含的一些功能包括突变、数据查询和自动完成查询。
  • GraphQL 游乐场: 它是一个功能强大的 IDE,具有内置编辑器,用于处理突变、验证、GraphQl 查询、订阅等。开发人员可以使用这个 IDE 来可视化模式的结构。
  • PRISMA: Prisma 是一个数据库抽象层,它将您的数据库转换为具有 CRUD(创建、读取、更新和删除)操作的 GraphQL API。
  • : 它是一个将可重用代码转换为组件的开源工具和平台。开发人员可以使用它们来共享和开发各种项目。

结语

  • GraphQL 是 Facebook 开发的一种应用层服务器端技术,用于使用现有数据执行查询。
  • 您可以使用 GraphQL 通过单个 API 调用来获取数据。
  • GraphQL 帮助您提高移动应用程序的性能。
  • 重要的 GraphQL 查询组件是:1)查询,2)解析器,3)模式。
  • GraphQL 是强类型的。这意味着查询是在特定系统的上下文中执行的。
  • GraphQL 客户端是向相关 GraphQL 服务器发出 POST 请求的代码。
  • GraphQL 服务器是 GraphQL 规范的服务器端实现。
  • 网关是一种微服务模式,您可以在其中构建单独的服务来应对其他后端服务。
  • GraphQL 有一个很好的方法可以从查询中分解出动态值。
  • 变异是改变 GraphQL 中的数据集的一种方法。
  • 设计 GraphQL 时的重点是:1)命名,2)特殊性,3)输入对象唯一的有效负载类型,以及 4)嵌套。
  • GraphQL 可以按照模式来组织,而 REST 可以按照端点来组织。
  • GraphQL的缺点是缺乏后端部分的资源。