npm 包 fetch-graphql-schema 使用教程

前言

GraphQL 是一种 API 查询语言，它允许客户端指定需要的数据结构，避免了 REST 中多个 API 端点的反复请求。GraphQL 用于查询数据，而不是为特定的 GET、POST、PUT 和 DELETE 请求编写代码，这使得编写代码变得简单且更加精简。这种查询语言的兴起也使得写前端逐渐变得更加高效实用。

如果你正在使用 GraphQL 或者想要使用它，那么在前端中，可以使用 fetch-graphql-schema 这个 npm 包来快速获取 GraphQL Schema，在这篇文章中，我们将来详细的介绍 fetch-graphql-schema 包的使用方法。

什么是 fetch-graphql-schema 包？

fetch-graphql-schema 是一个用于从 GraphQL 服务端获取 schema 的 Node.js 包。使用这个包可以帮助你更容易地获取较大的 GraphQL schema。

安装

在使用 fetch-graphql-schema 前，需要先进行安装，可以使用下面的指令进行安装：

npm install fetch-graphql-schema --save-dev

使用方法

在安装完成之后，我们可以在 Node.js 中使用以下代码调用 fetch-graphql-schema 包来获取 GraphQL schema。

const fetchSchema = require('fetch-graphql-schema');
 
fetchSchema('http://localhost:4000/graphql').then(schema => {
  console.log(schema);
});

在上面的示例代码中，我们调用 fetchSchema 方法，并传入我们需要获取 schema 的 GraphQL 服务端路径。当获取成功时，fetchSchema将返回 schema，并在终端中输出 schema。

进一步操作

如果你想将获取到的 schema 存储为一个本地文件，可以在 Node.js 中使用以下代码：

const fs = require('fs');
const fetchSchema = require('fetch-graphql-schema');
 
fetchSchema('http://localhost:4000/graphql').then(schema => {
  fs.writeFileSync('./schema.graphql', schema);
});

以上代码将 schema 存储在当前路径的 schema.graphql 文件中。接下来我们可以使用 local schema 的文件路径来设置我们 client 的 schema。

如果你正在使用 Apollo Client 进行 GraphQL 请求，可以使用这样的方法：

-- -------------------- ---- -------
------ - ------------ - ---- ----------------
------ - ------------- - ---- ------------------------
------ - -------- - ---- -------------------
------ ----- ---- -------------

----- ----------- - --------------------------------
 
-------------------------------------------------------- -- -
  ----- ----- - --- ----------------
  ----- ---- - --- ----------
    ---- --------------------------------
    ------
  ---
   
  ----- ------ - --- --------------
    ------
    -----
    --------- -------
  ---
---

在以上的代码中，我们首先通过 fetch-graphql-schema 来获取了本地的 Schema，接下来就是正常的基于 apollo-client 的请求流程。

总结

在这篇文章中，我们介绍了 fetch-graphql-schema 这个 npm 包的安装和使用方法。通过使用这个工具，在 GraphQL 前端开发中，我们能够更加方便地获取 Schema，从而提高开发效率。同时也建议大家尝试使用 GraphQL，它可以更快地满足我们的数据需求，大大减少了接口维护的问题，并使开发变得更加易于管理。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/79391