GraphQL 是一种用于 API 开发的查询语言和运行时。它由 Facebook 于 2012 年开发，目的是为了替代 RESTful API。虽然目前使用 RESTful API 的频率极高，但 GraphQL 作为一种更加高效、灵活且易于理解的 API 工具，正在成为越来越多的前端工程师的首选。
什么是 GraphQL？
GraphQL 是一种基于标记语言的查询语言，它通过定义一套 API 与前端工程师建立连接。与 RESTful API 不同，GraphQL 思路不是按照资源去设计，而是按照客户端使用的视角去设计。也就是说，前端工程师可以根据自己的需要自由地组合、选择 API 的输出内容。
GraphQL 分为三个部分：查询语言、服务端和客户端。前端工程师通过查询语言发起请求，服务端将结果返回，客户端响应并呈现结果。
如何使用 GraphQL？
使用 GraphQL 可以分三步走：
1. 创建 Schema
Schema 是用来描述查询的类型结构的。在 GraphQL 中，Schema 包含了三种类型：Query、Mutation 和 Subscription。其中 Query 是可选的，而 Mutation 和 Subscription 是必选的。
-- -------------------- ---- ------- ---- ----- - ---------- ------ ------ ------------------ ------- --------- ----- -------- - ---- ------ - --- ---- ---------- ------ --------- ------ ------ ------ - ---- ---- - --- ---- ------ ------ --------- ---- -
如上，我们定义了三个类型：Query 类型、Author 类型和 Book 类型。其中 Query 类型作为根节点，Author 和 Book 类型则可以用来拓展查询。
2. 编写 Resolver
Resolver 的任务是负责解析 Schema 中定义的类型，返回实际的数据。
-- -------------------- ---- -------
----- ------- - -
-
--- --
---------- -------
--------- ------
------ -
-
--- --
------ -------- -----
--------- --
--
--
--
--
----- --------- - -
------ -
------- --- - -- -- -- --------------------- -- --------- --- ----
----------- --- - ------- -------- -- -- -
--- ------- - -------------
-- -------- -
------- - ----------------------- --
--------------------------------- -- --------------------------------
--
-
-- ---------- -
------- - ---------------- ----------
-
------ --------
--
--
------- -
------ -------- -- -
------ ------------------- -- ------------- --- -----------
--
--
--
------ ------- ----------如上，我们定义了两个 Query 类型的 Resolver 和一个 Author 类型的 Resolver。其中，firstBook 和 allAuthors 用来查询数据，books 用来获取一个作者的所有书。
3. 发起请求
使用 GraphQL，前端工程师会向服务端发起请求，请求会以一个 JSON 对象的形式被发送至服务端。如下是一个发起 GraphQL 请求的 JavaScript 示例代码：
-- -------------------- ---- -------
------ - ------------- ---- ------------- - ---- -----------------
----- ------ - --- --------------
---- ------------------------------
------ --- ----------------
---
------
--------
------ ----
----- --------- -
---------- -- -
--
---------
--------
----- -
--
-----
-
-
-
--
--
-------------- -- ---------------------如上所示，我们使用 ApolloClient、gql 和 InMemoryCache 创建出一个 GraphQL 客户端，并调用其 query 方法发起请求，query 方法的参数为一个 graphql string。
GraphQL vs. RESTful API
在使用 RESTful API 进行开发时，一般需要考虑如何组织资源的映射关系，并通过 URL 暴露给客户端。但随着系统和应用功能的增加，RESTful API 的 URL 结构会变复杂，很难满足系统和应用各种查询的要求。
相对于 RESTful API，GraphQL 有以下优势：
1. 接口精简
RESTful API 通常为每个资源都提供一个固定 URL，URL 中包含资源的集合、子集合等信息。如果需要获取某个相关联的资源，则必须获取完整的父资源url，然后再进行关联。
GraphQL 中则不同，因为Schema中已经定义了数据模型，客户端只需要通过数据查询请求所需嵌套的信息，服务端会根据Schema返回所需的数据，减少了无用的数据通信。
2. 灵活性
在 RESTful API 的 URL 结构中，一旦设计存在问题，后期改动将比较困难。GraphQL 通过 Schema 的方式来组织数据结构和数据查询，前端可以方便的根据自己的需要自由组合、查询、更新、删除数据。
3. 标准化
GraphQL 提供了强类型系统，所有数据类型均通过 Schema 的方式来定义，并且服务端的响应也遵循对象类型定义。因此合同开发人员能够更容易地与客户端工程师进行沟通。
GraphQL 的应用场景
由于 GraphQL 具有灵活、精简、标准化等优点，因此 在以下场景经常使用 GraphQL。
数据驱动的应用
对于数据输入高，并且复杂的应用程序，以及那些需要纵向导航大量组合数据的应用程序，GraphQL 的数据询问语言等属性尤为适用。此类应用程序包括：多层次的关系、网格数据等复杂场景。
前端应用
GraphQL 相较于 REST API 的优势使其在开发前端应用上优势明显。前端应用通常需要更高的速度和更少的延迟，而 REST API 所提供的数据结构和数据查询往往会增加浏览器访问数据的延迟，而GraphQL通常可以显著减少数据请求数量，减少数据/查询的大小，提高应用性能。
总结
GraphQL 是一种用于 API 开发的查询语言和运行时，它基于标记语言而非 URL 并且通过 Schema 定义数据结构。GraphQL 相对于 RESTful API 有着更为灵活、精简、标准化等多方面的优势，使得 GraphQL 的应用场景越来越多。
如果你是前端工程师，我相信你一定会因为 GraphQL 的优势而越来越认可它，并做出自己的选择。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a1531148841e9894d9992b