如何使用 GraphQL 进行数据层的开发工作

GraphQL 是一种比传统 REST API 更为灵活和高效的数据查询语言,当今前端开发中越来越受到欢迎。它可以帮助我们快速地定义数据模型和数据查询方式,并且让前端开发者更能够在数据交互方面发挥自己的专业技能。本文将为大家介绍如何使用 GraphQL 进行数据层的开发工作,内容详细且有深度和学习以及指导意义,同时还包含示例代码。

GraphQL 入门

GraphQL 是一种由 Facebook 开源的查询语言,它可以通过 API 查询端点来获取需要的数据。最初用于在 React 中管理数据,它已经成为现在多个语言和 Web 框架的标准了。GraphQL 的基本思想是将数据看做一个图形,然后定义查询这张图的方式。因此,我们在使用 GraphQL 进行数据查询时,只需要关注需要查询的数据的结构和字段即可,而不用关心后端是如何实现的。下面我们假设一个网络应用需要获取某个博客文章的所有评论,下面是一般 RESTful 查询方式的 URL 请求:

----------------------------------------

这里我们需要填写对应的文章 id,但我们并不清楚所需查询的评论具体有哪些字段。如果使用 GraphQL 则可以这样创建查询:

----- ------------------------ ---- -
    -------- -------- -
        -------- -
            --
            ----
            ------ -
                --
                ----
            -
        -
    -
-

GraphQL 查询中可能包含多个查询方法。上面的例子中我们定义了一个名为 GetBlogComments 的查询函数,它需要传入文章的 id 以获取查询结果。这里我们定义一个变量 $postId,用来传递参数。GetBlogComments 查询中还包含了其他多个查询函数,比如 postcomments。通过 post 查询我们可以查询到当前文章的所有信息,比如标题、分类、作者等;通过 comments 查询我们可以获取到所有评论的数据信息。在这两个查询函数中,我们通过字段名来查询具体的数据字段。在上面的示例中,我们查询了评论的 id,text 和 author,同时也查询了作者的 id 和 name。

GraphQL 的优势

上面简单介绍了 GraphQL,接下来我们来了解一下 GraphQL 的一些优势:

灵活性

GraphQL 的最大优势是其灵活性。与传统的 REST API 不同,GraphQL 的查询结果可以精确地符合我们的需求。例如,在通过 REST API 获取数据时,如果要获取 User 某个属性的值,可能需要向服务器请求整个 User 对象,然后在本地提取出需要的属性;而在 GraphQL 中,则可以通过指定需要查询的属性,直接访问目标属性。

性能

在传统 REST API 中,当需要查询多个实体时,需要进行多个请求。每个请求都需要建立连接和验证身份,这将导致网络请求和效率变慢。在使用 GraphQL 进行数据查询时,则只会发起一次请求即可获取需要的全部数据。这样可以有效提高网络请求的效率。

可扩展性

GraphQL 旨在为未来的功能提供完整支持。它旨在构建一个强大的查询语言,可以轻松扩展,因此可以支持更多功能。GraphQL 还允许 API 的不同版本之间的平滑转换。

使用 GraphQL 进行数据查询

理解了 GraphQL 的概念和优势,我们可以考虑使用 GraphQL 进行数据查询。为了说明如何将 GraphQL 添加到您的应用程序,请考虑以下步骤:

1. 创建 GraphQL schema

在开始查询之前,我们需要定义数据模型和结构。GraphQL 使用 schema 来描述数据的结构和类型,它可以帮助我们了解可用的查询类型和可用的数据源。下面是一些示例代码:

---- ----- -
  --------- --------
-

---- ---- -
  --- ---
  ------ -------
  ------- -------
-

---- ------ -
  --- ---
  ----- -------
  ------ --------
-

在该模式中,我们定义了 Query 类型来公开所有书籍的 allBooks 这一个查询函数。其余两个类型为 BookAuthor,这些类型定义了数据模型的字段。

注意 ! 表示类型不可为空。

2. 编写 GraphQL 查询

在了解了模式之后,我们可以开始编写查询语句。查询可以使用 GraphQL 中的一些特定的语法,我们可以通过它们指定期望的查询对象。下面是一些示例代码:

----- -
  ---------- ---- -
    ----
    ----- -
      -----
    -
  -

  -------- -
    -----
    ------ -
      ----
    -
  -
-

该查询将获取 ID 为 1 的 Authorname,和所有 Booktitle 和对应的作者 name

3. 定义 GraphQL 的 resolver

我们可以通过 resolver 来实现 GraphQL 查询,resolver 是一个命令式的查询处理程序,它可以根据查询的类型和输入来检索或计算数据。

----- --------- - -
  ------ -
    ---------- -
      ------ ------
    --

    --------- ----- -
      ------ ------------- - -- ---
    -
  --

  ----- -
    ------------ -
      ------ ------------- - --- ------------- ---
    -
  --

  ------- -
    ------------- -
      ------ ------------- - --------- --------- ---
    -
  -
--

在上面示例中,我们定义了 Query 解析器,allBooksauthor 表示数据源中的两个不同实体。resolver 接收两个参数,第一个参数为父节点,本例中我们使用 _ 占位符将其跳过。第二个参数是由调用方传递的参数集合对象,其中查询参数会自动映射到这里。

BookAuthor 的解析器类似。这些函数接收一个实体作为输入,并根据需要获取它们之间的关系。

4. 建立 GraphQL 服务器

通过使用以下命令,我们可以构建 GraphQL 的服务器:

----- - ------------ - - ---------------------------------
----- ------- - -------------------
----- --- - ----------

----- ------ - --- --------------
 -------
 ---------
---

------------------------ --- ---

在上面的示例中,我们使用了 apollo-server-expressexpress 并创建一个实例 server。然后,我们通过将应用程序中间件配置为 server 对象来将其连接到 express 服务器上。

接下来,我们可以在浏览器中访问 http://localhost:PORT/graphql 获取 GraphQL 服务器的 Playground 界面,即 GraphQL 的 Web 调试工具。

结论

我们已经了解了如何使用 GraphQL 进行数据层开发。在实际开发中,通过使用 GraphQL,可以帮助我们快速定义数据模型和查询方式,有效使用 API 资源。GraphQL 的重要性越来越受到前端开发者们的认可和关注,值得我们不断深入学习和使用。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/670886e5d91dce0dc8720b77