在开发 Web 应用时，API 是不可或缺的一环。传统的 RESTful API 在使用过程中有许多不足的地方，例如 API 设计不够灵活、数据结构复杂等等。而 GraphQL 则是一个相对新的技术，它能够解决 RESTful API 存在的一些问题，并且具有更好的灵活性和可扩展性。
本文将介绍什么是 GraphQL，如何使用 GraphQL 来构建 API，以及如何集成到现有的应用程序中。
什么是 GraphQL
GraphQL 是一种用于 API 的查询语言，它由 Facebook 开发并于 2015 年首次公开亮相。GraphQL 可以更好地描述数据，并使客户端能够准确地获取需要的数据，而不是像 RESTful API 那样只能使用预定义的接口获取预定义的数据结构。
每个 GraphQL 查询都是由客户端定义的，这意味着客户端可以请求任何数据，并且只接收其真正需要的数据，这避免了过度获取数据的问题。另外，GraphQL 还支持通过查询参数来实现分页、排序等功能。
如何使用 GraphQL 构建 API
下面我们将介绍 GraphQL 的基本概念和操作。
Schema
GraphQL 允许我们使用一种名为 Schema 的数据结构来描述我们的 API。Schema 包含了类型和操作等信息，它定义了 API 暴露给客户端的数据结构和操作。
Schema 中的每个类型都有一个名称和一组字段，这些字段也是此类型返回的数据的一部分。例如，在一个博客应用程序中，我们可能有一个类型名为 Post，其中包含字段 title、author 和 content。
type Post {
title: String
author: User
content: String
}Query
在 GraphQL 中，我们使用查询来向 API 发送请求。查询由其名称和可选参数组成，它描述我们希望在 API 中获取的数据。
例如，在博客应用程序中，我们可能希望获取特定作者的文章列表。我们可以写一个名为 postsByAuthor 的查询：
query postsByAuthor($authorId: ID!) {
posts(authorId: $authorId) {
title
content
}
}在此查询中，我们传入了一个名为 authorId 的参数，以确保我们只检索特定作者的文章。查询将返回文章标题和内容的列表。
Mutation
除了查询，GraphQL 还支持 Mutation，即修改操作。Mutation 类似于查询，但它们用于更改数据。
例如，将创建一个新博客文章的 Mutation 如下所示：
mutation createPost($post: PostInput!) {
createPost(post: $post) {
id
title
content
}
}在此 Mutation 中，我们传递了一个名为 post 的参数，其中包含要创建的文章的详细信息。Mutation 将返回新文章的 ID、标题和内容。
Resolver
Resolver 是 GraphQL 中的重要概念，它定义了执行查询或 Mutation 并返回结果的逻辑。Resolver 通常使用开发人员提供的函数实现，这些函数将接收 GraphQL 查询或 Mutation 作为输入，并返回与请求对应的数据。
例如，在博客应用中，我们可能有一个 Resolver 将查询 postsByAuthor 映射到一个称为 _postsByAuthor 的函数。此函数将查询数据库并检索所有特定作者的文章。
const resolvers = {
Query: {
postsByAuthor: (_parent, { authorId }, _context, _info) =>
_postsByAuthor(authorId),
},
};在此示例中，_postsByAuthor 函数采用作者 ID 作为参数，然后查询数据库以获取所有相关文章的标题和内容。
示例代码
以下是使用 GraphQL 构建博客应用程序的示例代码：
-- -------------------- ---- -------
---- ----- -
----------------------- ----- ------
-------- ----- ----
------ ------
-
---- -------- -
---------------- ------------ ----
---------------- ------------ ----
-
---- ---- -
--- ---
------- -----
------ -------
-------- ------
-
----- --------- -
--------- ---
------ -------
-------- ------
-
---- ---- -
--- ---
----- -------
------ -------
-
- -------- --
----- --------- - -
------ -
-------------- --------- - -------- -- --------- ------ --
-------------------------
----- --------- - -- -- --------- ------ -- ----------
------ -- -- ---------
--
--------- -
----------- --------- - ---- -- --------- ------ --
------------------
----------- --------- - ---- -- --------- ------ --
------------------
--
----- -
------- --------- ------ --------- ------ --
-------------------------
--
--
----- -------------- - ---------- -- -
-- --------------
--
----- ----- - ---- -- -
-- --------------
--
----- ------ - -- -- -
-- --------------
--
----- ----------- - ------ -- -
-- --------
--
----- ----------- - ------ -- -
-- ----------
--
----- ------- - ---------- -- -
-- --------------
--如何集成到现有的应用程序中
将 GraphQL 集成到现有的应用程序中通常比创建新应用程序更具挑战性。典型的集成方法是使用中间件。例如，在 Express 应用程序中使用 Apollo Server：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- - ------------ - - --------------------------------- ----- -------- - -------------------- ----- --------- - ---------------------- ----- --- - ---------- -- ----------- ----- ------ - --- -------------- --------- --------- --- ------------------------ ---- ----- ---------- --- ------------ ----- ---- -- -- -- ------------------- --------- -- ------------------------------- --
在此示例中，我们创建了一个 Express 应用程序并使用路由 /graphql 挂载了一个 Apollo Server 实例。我们通过 typeDefs 和 resolvers 参数告诉 Apollo Server 如何解析客户端发出的请求。
结论
GraphQL 是一种全新的 API 查询语言，可以帮助您构建更好的 API。本文介绍了 GraphQL 的基本概念和操作，包括 Schema、Query、Mutation、Resolver 等，并提供了示例代码，帮助您快速开始使用 GraphQL。最后还介绍了如何将 GraphQL 集成到现有的应用程序中。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674db6a8947dc5bcb3012944