随着前端技术的不断发展，越来越多的应用需要与后端进行数据交互。而传统的 RESTful API 已经不能满足当今应用的需求，因此 GraphQL 作为一种新型的 API 技术应运而生。本文将介绍如何使用 JavaScript 和 GraphQL 构建 API，并提供相关示例代码。
什么是 GraphQL？
GraphQL 是一种由 Facebook 开源的数据查询语言和运行时。它使得客户端能够准确地获取他们需要的数据，而不必依赖于服务器返回的固定数据结构。GraphQL 也是一种用于开发 API 的技术，它通过定义类型和字段来描述 API 的数据模型，客户端可以根据自己的需求精确地查询 API 中的数据。
与传统的 RESTful API 不同，GraphQL 具有以下优点：
- 精确查询：GraphQL 的查询是由客户端定义的，客户端可以精确地获取他们需要的数据，而不必等待服务器返回整个数据结构。
- 可组合：GraphQL 支持在一个请求中获取多个资源，可以减少网络请求的次数。
- 自描述：GraphQL 的类型系统使得 API 更加自描述，客户端可以根据类型定义来查询 API 中的数据。
- 可扩展：GraphQL 的类型系统允许开发者轻松地添加新的字段和类型。
如何使用 JavaScript 和 GraphQL 构建 API？
使用 JavaScript 和 GraphQL 构建 API 的过程主要包括以下步骤：
1. 定义 GraphQL Schema
GraphQL Schema 描述了 API 中的数据结构和查询方式。在 JavaScript 中，可以使用 graphql 模块来定义 Schema。
-- -------------------- ---- -------
----- - -------------- ------------------ ------------- - - -------------------
----- -------- - --- -------------------
----- -------
------- -
--- - ----- ------------- --
----- - ----- ------------- --
------ - ----- ------------- --
--
---
----- --------- - --- -------------------
----- --------
------- -
----- -
----- ---------
----- -
--- - ----- ------------- --
--
-------- -------- ----- -- -
-- -- -- ------
--
--
--
---
----- ------ - --- --------------- ------ --------- ---在上述代码中，我们定义了一个名为 User 的类型，它包含了 id、name 和 email 三个字段。我们还定义了一个名为 Query 的类型，它包含了一个名为 user 的字段，该字段接受一个 id 参数，返回一个 User 类型的对象。最后，我们使用 GraphQLSchema 构造函数将 QueryType 作为参数创建了一个 Schema。
2. 编写 Resolver
Resolver 是用于处理 GraphQL 查询的函数，它接受查询参数并返回查询结果。在 JavaScript 中，可以使用 graphql 模块的 graphql 函数来执行查询，该函数接受一个 Schema 和一个查询字符串作为参数。
-- -------------------- ---- -------
----- - ------- - - -------------------
----- ----- - -
----- -
-------- ---- -
--
----
-----
-
-
--
--------------- ------------------ -- -
--------------------
---在上述代码中，我们定义了一个查询字符串，它调用了 user 字段，并传入了一个 id 参数。我们使用 graphql 函数执行了这个查询，并打印了查询结果。
3. 使用 Express 创建 GraphQL API
在实际应用中，我们通常会使用 Express 来创建 GraphQL API。可以使用 express-graphql 模块将 GraphQL Schema 和 Resolver 集成到 Express 中。
-- -------------------- ---- ------- ----- ------- - ------------------- ----- - ----------- - - --------------------------- ----- --- - ---------- ------------------- ------------- ------- --------- ----- ---- ---------------- -- -- - ------------------- -- ------- -- ---- ------- ---
在上述代码中，我们创建了一个 Express 应用，并使用 graphqlHTTP 函数将 GraphQL Schema 集成到了 Express 中。我们还设置了 graphiql 为 true，这样我们就可以在浏览器中使用 GraphiQL 工具来测试 API。
总结
本文介绍了如何使用 JavaScript 和 GraphQL 构建 API，包括定义 GraphQL Schema、编写 Resolver 和使用 Express 创建 GraphQL API。GraphQL 作为一种新型的 API 技术，具有精确查询、可组合、自描述和可扩展等优点，可以帮助我们构建更加灵活和高效的应用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6558094bd2f5e1655d247910