前言
GraphQL 是一种新一代的 API 查询语言，其可以让客户端只请求所需的数据，避免了一些常见的 REST API 的缺点。我们在前端开发中，常常需要调用 GraphQL API，因此需要使用适当的工具来简化这一过程。
本文将介绍 npm 包 graphql-js-client 的使用方法，该包是一个小型但功能强大的 GraphQL 客户端库。它可以生成符合 GraphQL 规范的查询请求，还可以自动处理查询变量，它的目标是解决在客户端中编写查询的麻烦。本文将介绍该工具的基本使用方法。
环境
在开始之前，我们假设您已经安装了 Node.js 以及 npm。
安装
我们可以通过 npm 安装 graphql-js-client：
npm install graphql-js-client
使用
在我们使用 graphql-js-client 时，我们需要提供 GraphQL API 的端点 URL 以及查询的详细信息。通常，我们会将查询信息的具体实现和数据的展示分离开来，这样我们可以更好的组织代码和逻辑。下面我们以一个简单的例子来演示 graphql-js-client 的用法。
我们假设有一个 GraphQL API，它的端点 URL 是 https://api.example.com/graphql，该 API 使用的是如下的 GraphQL schema：
-- -------------------- ---- ------- ---- ----- - ------ ------ -------- ----- ---- - ---- ---- - --- --- ------ ------- -
该 API 可以查询所有图书以及根据 ID 查询特定的一本书。我们想要使用 graphql-js-client 来查询所有图书的标题列表以及查询 ID 为 123 的书籍的详细信息。我们可以将这些查询封装到一个名为 queries.js 的文件中，如下所示：
-- -------------------- ---- -------
----- - ----------------- - - ------------------
----- --- - ----------------------
----- - ------------------- - - ----------------------------
----- ------ - -------------------
------ ----
----- -
----- -
-----
-
-------- ------ -
-----
-
-
--
--
-------------- - ---------------------
-------
--------- ----------------------------------
--在此代码中，我们首先使用 buildClientSchema 函数构建一个协议定义。然后，我们将这个协议定义传递给 createGraphQLClient 函数，以创建并返回一个 GraphQL 客户端。
现在，我们可以使用这个客户端来发出 GraphQL 查询。下面是实际的查询代码：
-- -------------------- ---- -------
----- ------ - --------------------
--------------
----- -
----- -
-----
-
-------- ------ -
-----
-
-
------------ -- -
-------------
------ -----------
----- ----------
--
--在此代码中，我们首先引入了 queries.js。这个模块返回了一个 GraphQL 客户端。接下来，我们使用 query 方法发出 GraphQL 查询。在我们成功地获得了查询结果时，我们将数据输出到控制台中。
意义
在本文中，我们学习了如何使用 graphql-js-client 包来发出 GraphQL 查询请求。使用该工具可以大幅度简化前端开发中使用 GraphQL 的流程，让我们更好的聚焦在业务逻辑上，从而提高开发效率。如果您正在寻找一个小型但功能强大的 GraphQL 客户端库，那么 graphql-js-client 绝对值得一试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedcb22b5cbfe1ea061254b