GraphQL 是一种用于 API 的查询语言，它是由 Facebook 开发的，可以明确客户端需要哪些数据，避免了传统 RESTful API 中过度拉取数据的问题。graphql-js-schema-fetch 就是一个可以用来构建 GraphQL schema 和进行数据查询的 npm 包，能够方便地将数据与 GraphQL 视图结构进行映射。
本篇文章将介绍如何使用 graphql-js-schema-fetch 包来构建一个简单的 GraphQL API 并查询数据。
安装
首先需要在项目目录下使用以下命令安装 graphql-js-schema-fetch：
npm install graphql graphql-tools graphql-js-schema-fetch express
这个例子中还使用了 express 框架来启动一个 GraphQL 服务器，所以也需要安装 express。
构建 schema
GraphQL 中的 schema 定义了可以被查询到的 fields 和 types，其中每个 field 可以包含多个 argument，而每个 type 可以被定义成 Object、Interface 或 Union，表示可以扩展 schema 的特性。graphql-js-schema-fetch 提供了构建这样的 schema 的工具。
在这个例子中，我们将构建一个简单的 schema 来查询用户的信息。可以先定义一个 User 类型和一个 users 查询，如下所示：
-- -------------------- ---- -------
----- - -------------------- - - -------------------------
----- -------- - -
---- ---- -
--- --
----- ------
------ ------
-
---- ----- -
------ ------
-
--
----- --------- - -
------ -
------ -- -- -
- --- -- ----- -------- ------ ------------------- --
- --- -- ----- ------ ------ ----------------- --
--
--
--
----- ------ - ----------------------
---------
----------
---以上代码定义了一个 User 类型，包含了 id、name 和 email 三个 fields，而 users 查询返回了两个用户的信息列表，其中 id、name 和 email 都属于 User 类型。这里使用了 graphql-tools 中的 makeExecutableSchema 来将 typeDefs 和 resolvers 转化成可执行的 schema，方便查询器调用。
运行服务器
在定义并构建好 schema 后，需要将其与一个 GraphQL 服务器集成。在此我们使用 express。
-- -------------------- ---- ------- ----- ------- - ------------------- ----- - ----------- - - --------------------------- ----- - ----- - - ----------------------------------- ----- --- - ---------- ----- ---- - ----- ------------------- ------------- ------- --------- ----- ---- ---------------- -- -- - ---------------- --------- -- --------------------------- ---
以上代码使用了 express 的中间件 graphqlHTTP 将 schema 与服务器集成。这里的 graphiql: true 表示使用 GraphiQL 工具作为客户端查询数据的方式，可以快速测试我们定义的 schema。运行服务器时只需使用 node index.js 命令即可。
查询数据
最后，在启动服务器后，我们可以在浏览器访问 http://localhost:3000/graphql 进入 GraphiQL 页面。
在这里我们可以进行如下查询：
{
users {
id
name
email
}
}以上查询会返回两个用户的 id、name 和 email。
总结
本文介绍了 graphql-js-schema-fetch 的使用方法，包括定义 schema、集成 GraphQL 服务器和查询数据，现在你可以尝试自己用它来构建更加复杂的 GraphQL API 了。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedcb22b5cbfe1ea061254e