在现代 Web 应用程序开发中，API 是不可或缺的一部分。REST API 是最常见的 API 类型之一，但是随着应用程序的复杂性增加，我们需要更灵活、更高效的 API。GraphQL 就是一个很好的解决方案，它可以代替 REST API，更好地满足我们的需求。
什么是 GraphQL？
GraphQL 是一种查询语言，用于 API 的描述和查询。它由 Facebook 开发，于 2015 年首次发布。GraphQL 的主要优点是它提供了一种更高效、更灵活的方式来获取数据。它可以让客户端明确地指定它需要的数据，而不是像 REST API 那样获取整个资源。
GraphQL 与 REST API 的比较
GraphQL 与 REST API 有以下几个主要区别：
数据获取方式：REST API 获取整个资源，而 GraphQL 可以获取指定的字段。
多个请求：REST API 通常需要多个请求才能获取所需的数据，而 GraphQL 只需要一个请求。
数据格式：REST API 返回的数据格式是固定的，而 GraphQL 返回的数据格式是由客户端指定的。
缓存：REST API 的缓存是基于 URL 的，而 GraphQL 的缓存是基于查询的。
GraphQL 的基本概念
在学习如何使用 GraphQL 之前，我们需要了解一些基本概念。
Schema
Schema 定义了可以查询的数据类型和字段。它描述了数据的结构，类似于 REST API 的路由。Schema 由类型和字段组成。
Query
Query 是一种用于获取数据的 GraphQL 操作。它类似于 REST API 的 GET 请求。Query 可以指定要获取的字段和参数。
Mutation
Mutation 是一种用于修改数据的 GraphQL 操作。它类似于 REST API 的 POST、PUT 或 DELETE 请求。Mutation 可以指定要修改的字段和参数。
Resolver
Resolver 是一个函数，用于处理 Query 或 Mutation。它根据 Query 或 Mutation 的参数返回相应的数据。
如何使用 GraphQL？
现在让我们来看一下如何使用 GraphQL。
安装
首先，我们需要安装 GraphQL。可以使用 npm 或 yarn 安装它。在命令行中执行以下命令：
npm install graphql
或者
yarn add graphql
定义 Schema
接下来，我们需要定义一个 Schema。在这个例子中，我们将创建一个简单的 Schema，用于获取一些用户信息。在文件中创建一个名为 schema.js 的文件，并添加以下代码：
-- -------------------- ---- -------
----- - ----------- - - -------------------
----- ------ - -------------
---- ----- -
-------- ------ ----
------ ------
-
---- ---- -
--- ---
----- ------
------ ------
-
---
-------------- - -------在这个 Schema 中，我们定义了一个 Query 类型，它有两个字段：user 和 users。user 字段接受一个名为 id 的参数，并返回一个 User 类型的对象。users 字段返回一个 User 类型的数组。
定义 Resolver
接下来，我们需要定义一个 Resolver。Resolver 是一个函数，它根据 Query 或 Mutation 的参数返回相应的数据。在文件中创建一个名为 resolver.js 的文件，并添加以下代码：
-- -------------------- ---- ------- ----- ----- - - - --- -- ----- ----- ----- ------ ---------------------- -- - --- -- ----- ----- ----- ------ ---------------------- -- -- ----- -------- - - ----- -- -- -- -- --------------- -- ------- --- ---- ------ -- -- ------ -- -------------- - ---------
在这个 Resolver 中，我们定义了两个函数：user 和 users。user 函数接受一个名为 id 的参数，并返回一个与 id 匹配的用户对象。users 函数返回用户数组。
创建 GraphQL 服务器
现在，我们已经定义了 Schema 和 Resolver，我们需要创建一个 GraphQL 服务器。在文件中创建一个名为 server.js 的文件，并添加以下代码：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- - ----------- - - --------------------------- ----- ------ - -------------------- ----- -------- - ---------------------- ----- --- - ---------- ------------------- ------------- ------- ---------- --------- --------- ----- ---- ---------------- -- -- ------------------- ------- -- ---- --------
在这个服务器中，我们使用 express-graphql 中间件来处理 GraphQL 请求。我们传递了 Schema 和 Resolver，以及一个名为 graphiql 的选项。graphiql 是一个用于测试 GraphQL 请求的 Web 界面。
测试 GraphQL 服务器
现在，我们已经创建了一个 GraphQL 服务器，我们可以使用 graphiql 界面来测试它。在浏览器中访问 http://localhost:3000/graphql，您应该看到 graphiql 界面。
在图形化界面中输入以下查询：
{
users {
id
name
email
}
}这个查询将返回所有用户的 id、name 和 email 字段。
输出应该类似于以下内容：
-- -------------------- ---- -------
-
------- -
-------- -
-
----- --
------- ----- -----
-------- ----------------------
--
-
----- --
------- ----- -----
-------- ----------------------
-
-
-
-现在，我们已经成功地使用 GraphQL 创建了一个简单的 API。
结论
GraphQL 是一种更高效、更灵活的 API 方案，可以代替 REST API。它提供了一种更好的方式来获取和修改数据，可以减少网络请求和数据传输量。在本文中，我们学习了 GraphQL 的基本概念和如何使用它来创建一个简单的 API。如果您正在开发一个复杂的 Web 应用程序，我建议您考虑使用 GraphQL 来实现您的 API。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/676ad04b78388e33bb1bf1ac