使用 Fastify 和 GraphQL 构建 API

阅读时长 7 分钟读完

前端开发者需要掌握各种技术来构建应用程序。在 Web 应用程序中,构建可伸缩和高性能 API 是至关重要的。Fastify 是一个快速、轻量、易于使用,并且底层使用 Node.js 构建的 Web 框架。GraphQL 是一个API查询语言,可更好地定义API Schema以及提供给客户端灵活的查询机制。在本文中,我们将研究如何使用 Fastify 和 GraphQL 构建 API。

安装及基础知识

在本文中我们将建立一个简单的 API,它具有查询和保存图书的功能。要了解 Fastify 和 GraphQL 是如何工作的,我们需要掌握一些基本知识。

第一步是安装 Fastify 和 GraphQL 依赖。我们可以通过在终端中运行以下命令来安装它们:

第二步是了解 GraphQl。GraphQL 是一种用于编写 API 查询的查询语言。它包括一种定义 Schema 的方式和一种定义查询的方式。Schema 定义了所有可用的对象类型以及它们之间的关系。查询定义了我们从数据中请求的数据类型及其属性。

第三步是了解 Fastify。Fastify 是一个 Web 应用程序框架,它基于 Express 框架。它特别适合构建高性能 Web 应用程序。

创建API

我们将从创建 Fastify 实例开始。在文件 index.js 中输入以下代码:

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

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

使用快速工厂方法,创建一个实例并在指定端口(3000)和端口上监听。配置选项 logger true 用于在控制台上打印有意义的信息和错误。

定义 GraphQL Schema

为了定义 GraphQL Schema,我们可以使用 graphql-js 库。在 index.js 文件中,对 graphql-js 库进行导入并定义类型,输入类型和查询类型。以下是我们应用程序的示例 Schema:

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

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

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

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

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

上面的代码中,我们定义了一个名为 BookType 的对象类型,它包含图书的三个属性。然后,我们定义了 RootQuery 类型,包含两个查询:book 和 books。这两个查询接受一个 ID 参数,并利用 resolve 函数来获取数据。最后,我们定义了一个 Mutation 类型,它包含一个 addBook 变异器,可向数据库或其他源添加新书籍,并返回新添加的书籍。

创建 Fastify 路由

现在我们了解了如何定义 GraphQL Schema,如何在 Fastify 中创建一个实例,以及如何定义路由。我们需要使用 fastify-gql 插件来定义路由,插件提供了将 GraphQL Schema 与路由进行交互的功能。在 index.js 文件中,添加以下代码:

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

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

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

上面的代码中,我们首先导入 fastify-gql 插件和我们先前定义的 Schema。然后,我们在 Fastify 实例上注册路由,指定 schema 和 graphiql 选项。graphiql 选项提供了一个 Web 接口,您可以使用该接口查看和测试 API 并轻松进行查询。最后,我们通过 listen 方法来启动服务。

查询

启动服务器后,现在我们可以通过 localhost:3000/graphql 进行查询。在 graphiql 界面上,您将看到一个类似控制台的用户界面。使用以下查询获取所有书籍:

这将返回一组 ID、标题和作者的书籍。您可以使用类似以下查询的查询:

这将返回一本书的标题和作者,该书的 ID 为 1。您可以尝试与 addBook 变异器进行交互,向 API 添加新书。由于我们的代码仅为示例,您需要编写代码来将它们添加到数据库中。

结论

本文介绍了如何使用 Fastify 和 GraphQL 构建 API。我们了解了如何创建 Fastify 实例,定义 GraphQL Schema,创建 Fastify 路由以及如何进行查询。请记住,这只是 Fastify 和 GraphQL 的基本用法之一,您可以根据需求进行相应的修改。这一技能将帮助你更好的构建出支撑应用程序的高效API,进一步提升你的前端技能!

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67027b2ad91dce0dc8478a1f

纠错
反馈