如何使用 Express.js 构建一个基于 GraphQL 的 API 服务器
GraphQL 是一个已很流行的 API 查询语言,它允许前端应用按需获取数据,而不是像 RESTful API 一样一整个资源。在本文中,我们将使用 Express.js 以及其他相关库来构建一个基于 GraphQL 的 API 服务器。
准备工作
在开始之前,我们需要在我们的本地环境中安装 Node.js 和 npm。
接下来,我们还需要安装以下库:
- express: 一个流行的 Node.js 框架,用于构建 Web 应用。
- express-graphql: 使我们的 Express 应用程序支持 GraphQL。
- graphql: 用于实现 GraphQL 查询语言的 JavaScript 库。
npm install express express-graphql graphql --save
编写基础代码
首先创建一个文件,比如 app.js。然后在其中引入上面安装的库。
const express = require('express'); const graphqlHTTP = require('express-graphql'); const { buildSchema } = require('graphql');
我们还需要定义一个 GraphQL schema。在这个例子中,我们将定义一个名为 “person” 的类型。
-- -------------------- ---- ------- ----- ------ - ------------- ---- ----- - ---------- ------ ------ --------------- ----- -------- -- ---- -------- - ---------------- ----- ----- -------- ---- ------ ------ -- ---- ------ - --- --- ----- ------ ---- --- -------- ------ - ---展开代码
我们的 Schema 定义了数据的结构、访问方式和操作。
接下来,我们需要实现对于定义好的 Schema 的解析器。我们将使用一个包含 Person 数据的数组代表我们的数据源。
-- -------------------- ---- ------- -- -------- ----- ---------- - - ---- -- ----- ------ ---- --- -------- ---- ---------- ---- -- ----- ------- ---- --- -------- ---- ------- ---- -- ----- -------- ---- --- -------- ------------- - -- -- ------ --- ----- ---- - - ------- -- -- -- -- ----------------- -- ---- --- ---- ---------- -- ---- -- -- ---- - ----------------------- - ----------- ------------- -- --- ----- --- -- -- - ----- ------ - ----------------- -- ---- --- ---- -- --------- - ----- --- --------- ------ ---- -- -------- - ----------- - ----- ---------- - ---- ------ ------- -- --展开代码
现在我们已经有了一个可用的 GraphQL API 服务器。但我们需要把它添加到 Express.js 中。
-- -------------------- ---- ------- ----- --- - ---------- -------- ----------- ------------- ------- ------- ---------- ----- --------- ----- --- -- ---------------- -- -- -------------------- ------ -- --- ------- -- ---------------------------------展开代码
使用 GraphiQL 测试 API
现在我们的服务器已经可以工作了。让我们在 GraphiQL 工具中测试 API 吗?GraphiQL 是一个可交互的 GraphQL IDE,它允许我们查询服务器的数据。
打开 http://localhost:4000/graphql,您将看到 GraphiQL 编辑器和 API 文档页面。
如下是查询示例,它可以查询 id:1 的 person 的所有信息:
query { person(id: 1) { id, name, age, address } }
反之,这是一个修改 Person 数据的示例:
mutation { updatePerson(id: 3, name: "Lucas Smith", age: 25) { id, name, age, address } }
结论
我们已经学习使用 Express.js 构建基于 GraphQL 的 API 服务器。我们创建了一个简单的 schema,并实现了它的解析器。同时,我们还学习了如何使用 GraphiQL 进行查询和修改我们的数据。
GraphQL 具有很多令人惊叹的功能和用例,它可以提高前后端之间的通信效率。我们希望这篇文章可以帮助你了解如何使用 Express.js 以及 GraphQL 来构建你自己的 API 服务器。
参考资料
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/672c068fddd3a70eb6d42cc1