在前端开发中，使用 GraphQL 作为 API 接口是一种新的趋势。GraphQL 是一种由 Facebook 开源出来的查询语言和运行时环境，它可以提高数据查询效率并减少网络负载，而且使用起来也非常方便。本篇文章将介绍如何在 Express.js 中使用 GraphQL 作为 API 接口，同时提供示例代码和学习指导。
安装依赖
首先，我们需要安装一些必要的依赖。打开命令行窗口，进入你的项目目录，执行下面的命令：
npm install express express-graphql graphql
上面的命令会安装 Express.js 和 GraphQL 以及用于在 Express.js 中使用 GraphQL 的 express-graphql 模块。
创建 GraphQL Schema
GraphQL Schema 描述了你的应用中数据的类型和关系。在 Express.js 中，我们可以使用 GraphQLObjectType 和 GraphQLSchema 来创建 Schema。
-- -------------------- ---- -------
----- -
------------------
-----------
--------------
------------
-------------
- - -------------------
-- ---- ---- --
----- -------- - --- -------------------
----- -------
------- -
--- - ----- ---------- --
----- - ----- ------------- -
-
---
-- -- ----- --
----- --------- - --- -------------------
----- --------
------- -
------ -
----- --- ----------------------
-------- -- -- -
-- --------
------ -
- --- -- ----- ---- --
- --- -- ----- ---- --
- --- -- ----- ---- -
--
-
-
-
---
-- -- ------
----- ------ - --- ---------------
------ ---------
---上面的代码中，我们创建了一个名为 UserType 的类型，它拥有一个 id 和一个 name 属性，表示用户的编号和姓名。然后我们定义了一个名为 QueryType 的类型，它拥有一个名为 users 的字段，表示用户列表。resolve 函数会返回用户列表。最后，我们创创建了一个 GraphQLSchema 对象，将 QueryType 作为 query 的属性。
创建 Express.js 应用
现在我们需要在 Express.js 应用中使用我们刚刚创建的 Schema。接下来，我们将创建一个 Express.js 应用，使用 express-graphql 模块来创建 GraphQL API 接口。
-- -------------------- ---- -------
----- ------- - -------------------
----- ----------- - ---------------------------
----- -
------------------
-----------
--------------
------------
-------------
- - -------------------
-- ---- ---- --
----- -------- - --- -------------------
----- -------
------- -
--- - ----- ---------- --
----- - ----- ------------- -
-
---
-- -- ----- --
----- --------- - --- -------------------
----- --------
------- -
------ -
----- --- ----------------------
-------- -- -- -
-- --------
------ -
- --- -- ----- ---- --
- --- -- ----- ---- --
- --- -- ----- ---- -
--
-
-
-
---
-- -- ------
----- ------ - --- ---------------
------ ---------
---
-- -- ---------- --
----- --- - ----------
-- -- --------------- ------------ ------- --- ----- -------- ---
------------------- -------------
------- -------
--------- ---- -- -- -------- ----
----
-- ----
---------------- -- -- -
------------------- ------- -- ---- -------
---我们创建了一个名为 app 的 Express.js 应用，并使用 express-graphql 模块来创建 GraphQL API 接口，将其挂载到 /graphql 路径上。在 graphiql: true 的情况下，我们将可以使用 GraphiQL 进行测试和调试。
测试 API 接口
现在我们可以启动应用并测试 GraphQL API 接口了。在命令行中执行以下命令：
node app.js
然后在浏览器中打开 http://localhost:3000/graphql 地址，进入 GraphiQL 调试工具。在左边的 query 编辑器中输入以下查询语句：
{
users {
id
name
}
}然后点击右上角的 Run 按钮，就能看到类似下面的结果：
-- -------------------- ---- -------
-
------- -
-------- -
-
----- --
------- ----
--
-
----- --
------- ----
--
-
----- --
------- ----
-
-
-
-至此，我们已经成功地在 Express.js 应用中使用 GraphQL 作为 API 接口了。接下来你可以根据自己的需求和业务逻辑进行拓展。
总结
本文介绍了在 Express.js 中使用 GraphQL 作为 API 接口的方法，包括 GraphQL Schema 的创建、Express.js 应用的创建和 express-graphql 模块的使用。希望本文能够给你带来一些启发和指导，让你在前端开发中更加自如地使用 GraphQL。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a7d1cb48841e98944691c1