npm 包 @johnydays/express-graphql 使用教程

在前端开发领域中，Graphql 是一种非常流行的 API 查询语言。而 @johnydays/express-graphql 则是一个便捷且易于使用的 npm 包，用于在 Express 应用中使用 Graphql。在本篇文章中，我们将深入探讨 @johnydays/express-graphql 的使用方法，并提供详细的代码示例。

安装

使用 npm 安装 @johnydays/express-graphql：

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

基本用法

下面是一个使用 @johnydays/express-graphql 的基本示例，我们需要导入该包并使用 graphqlHTTP 方法创建一个 Graphql 中间件：

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

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

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

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

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

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

在上面的示例代码中，我们通过 buildSchema 方法创建了一个 Graphql Schema。在 Schema 中，我们定义了一个查询 hello，它的返回值类型为 String。

接下来，我们定义了一个名为 rootValue 的对象，它包含了一个 hello 方法，当查询 hello 时，该方法会被调用。

然后，我们创建了一个 Express 应用，并在 '/graphql' 路径下使用 @johnydays/express-graphql 中间件。在中间件的配置项中，我们传入了创建的 Schema 和 rootValue 对象。

最后，我们通过 app.listen 启动了应用，并在控制台输出了提示信息。

在浏览器中访问 http://localhost:3000/graphql，即可打开 Graphql IDE；在 IDE 中输入查询语句 { hello }，并点击运行按钮，会得到文字 Hello World! 的返回结果。

处理请求和错误

@johnydays/express-graphql 中间件提供了 formatError 和 formatResponse 两个配置项，用于处理请求和错误。

我们可以使用 formatError 对 Graphql 的错误进行自定义处理，在许多案例中，这非常有用。例如，可以用该方法将错误信息记录到日志中。

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

上面示例代码，我们使用 console.log 打印错误信息，并将错误对象返回。在实际开发中，我们可以将错误信息保存在日志文件中，以便日后排查错误。

另外，我们也可以使用 formatResponse 对 Graphql 的响应进行自定义处理。例如，可以通过该方法对响应结果进行加工或过滤。

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

上面的示例代码中，我们在 formatResponse 方法中对 Graphql 的响应进行了自定义处理。如果响应中存在错误，我们会将错误信息修改为一个自定义的错误信息。这种方式可以避免向用户暴露过多的技术细节。

处理请求体

默认情况下，@johnydays/express-graphql 中间件在请求体中解析 Graphql 查询。然而，对于某些环境或特定场景，可能无法直接从请求体中解析查询时，我们可以使用 Graphql 的 parse 函数手动解析查询语句。

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

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

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

上面的示例代码中，我们手动解析了请求体中的查询语句，并调用 Graphql 的 graphql 方法进行查询。在上述代码示例中，我们使用了 Express 应用的 post 方法来处理 Graphql 查询，并使用 ast 来执行查询。parse 方法可以用来解析查询语句，并根据需求进行额外的处理。

自定义 GraphQL 关联类型

GraphQL 中有一种非常有用的类型，称为“关联类型”（Relay）。可以使用关联类型来连接查询，从而避免重复的查询。然而，@johnydays/express-graphql 中间件不直接支持这种类型。

不过，我们可以使用 Graphql 的接口来定义自己的关联类型。

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

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

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

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

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

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

上面的代码示例中，我们使用 Graphql 的 nodeDefinitions 方法定义了自己的接口，以方便查询和使用。这个接口会被用于定义 UserType 和 CommentType 的关联类型。

在 UserType 中，我们定义了关联类型 comments，该字段连接了 UserType 与 CommentType（即评论），使得查询用户时，也可以同时查询其评论列表。

在 CommentType 中，我们定义了关联类型 user，该字段连接了 CommentType 与 UserType（即用户），使得查询评论时，也可以同时查询评论所属用户的信息。

最后，我们将定义好的 UserType 和 CommentType 作为参数，创建了 RootQueryType 和 RootMutationType。并将它们作为参数，创建了一个 GraphQLSchema。这样，我们就可以使用 @johnydays/express-graphql 中间件，将定义好的 Schema 部署到我们的应用中了。

结语

@johnydays/express-graphql 提供了一种非常方便的方法，用于在 Express 应用程序中使用 Graphql。在本文中，我们提供了详细的代码示例，向大家展示了如何使用该包来构建 Graphql API。除此之外，我们还介绍了如何处理 Graphql 的请求和错误，以及如何自定义 GraphQL 关联类型。我们希望这篇文章能够对你在应用程序开发中使用 Graphql 提供一些帮助。

来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066bc4967216659e2442fe

阅读全文

猜你喜欢

  • npm 包 @jaredhanson/make-node 使用教程

    简介 @jaredhanson/make-node 是一个用于构建 Node.js Native Addon 的简单、易用、灵活的工具。它提供了一组命令行工具，以及一些简单的配置和规则，可以帮助你快速...

    3 年前
  • npm 包 @jazmon/require-env-vars 使用教程

    什么是 @jazmon/require-env-vars 包？ 在开发前端应用程序时，环境变量是非常重要的一个因素。环境变量可以帮助开发人员在不同的环境中配置和管理应用程序的不同方面，例如数据库连接字...

    3 年前
  • npm 包 @jzetlen/bowserify 使用教程

    在前端开发过程中，我们常常需要使用 JavaScript 的模块化打包工具进行开发，其中最常用的是 npm 包管理工具和其插件。本文将介绍一款基于 npm 的 @jzetlen/bowserify，它...

    3 年前
  • npm 包 drag-drop.min.js 使用教程

    什么是 drag-drop.min.js? drag-drop.min.js 是一个基于 JavaScript 的 npm 包，用于处理拖放操作。它提供了一套简易的 API，可以让您轻松地将拖动操作应...

    3 年前
  • npm 包 @jmac18/epoch 使用教程

    什么是 @jmac18/epoch @jmac18/epoch 是一个可视化时间范围选择组件，适用于前端开发项目。它提供了强大的时间选择功能，可以在项目中轻松使用。

    3 年前
  • npm 包 drawing.min.js 使用教程

    在前端开发中，我们经常需要使用绘图工具来展示数据。而 drawing.min.js 是一个轻量级、易于使用的 npm 包，可以帮助我们快速创建各种类型的图形。本教程将向您展示如何使用 drawing....

    3 年前
  • npm 包 @jmfirth/lit-html-redux 使用教程

    在前端开发中，我们常常需要使用状态管理库来管理应用中的数据。Redux 是一个流行的状态管理库，但它通常需要大量的样板代码来完成基本的功能。同时，Lit-html 是一个高效的 DOM 更新库，能够保...

    3 年前
  • npm 包 @jworkshop/loadimage 使用教程

    前言 随着 Web 技术的快速发展，图像的处理和使用越来越频繁和重要。而前端工程师在开发过程中，也需要经常使用到图片的加载和处理。在这个时候，我们就需要使用一些工具来简化这些操作的过程。

    3 年前
  • npm 包 @jp928/react-native-circular-action-menu 使用教程

    前言 @jp928/react-native-circular-action-menu 是一个 React Native 的 npm 包，它通过提供一个圆形动作菜单来帮助您实现界面的美化和交互效果。

    3 年前
  • npm 包 "@joakimbeng/yml-reader" 使用教程

    前言 在 Web 开发中，我们经常需要读取一些 YAML 文件来进行数据渲染或其他操作。但是，JavaScript 并没有原生支持 YAML 文件的解析，因此我们需要借助一些第三方工具来实现这个功能。

    3 年前
  • npm 包 @jnupeter/unirest 使用教程

    前言 在前端开发中，经常需要发起网络请求，以获得后端数据或与后台进行交互。而在 JavaScript 中发起网络请求最常用的方法就是使用 Ajax，而如今我们也可以使用更加简单易用、功能更丰富的 np...

    3 年前
  • Java选择排序

    Java基础实例程序 在这个示例中，我们创建一个java程序，实现使用选择排序对数组元素进行排序。 在选择排序算法中，搜索最低的元素并将其排列到适当的位置。用下一个最小的数字交换当前元素。

    3 年前
  • Java插入排序

    Java基础实例程序 下面我们创建一个java程序，实现使用插入排序对数组元素进行排序。 插入排序对于小元素是有好处的，因为排序大量元素它需要更多的时间。 让我们来看看一个简单的java程...

    3 年前
  • Java气泡排序

    Java基础实例程序 在教程中，将创建一个java程序，使用冒泡排序对数组元素排序。 气泡排序算法也被称为最简单的排序算法。 在冒泡排序算法中，数组从第一个元素遍历到最后一个元素。

    3 年前
  • Java阿姆斯壮数(armstrongnumber) 实例

    Java基础实例程序 Java中的阿姆斯壮数(armstrongnumber) 定义：阿姆斯壮数(armstrongnumber) 是等于其数字的立方数之和的数字，例如：0，1，153，370...

    3 年前
  • Java阶乘实例

    Java基础实例程序 Java中的阶乘程序：n的阶乘是所有正整数的乘积。 n的因子由n!来表示。 例如： -- - ------- - -- -- - --------- - --- ...

    3 年前
  • Java回文实例

    Java基础实例程序 Java中的回文数定义：回文数是反向后与原数字也是相同的数字(即：从左边读和从右边读过来都是同一个数字)。 例如，545,151,3454,343,171,4884都是回...

    3 年前
  • Java素数实例

    Java基础实例程序 质数(prime number)又称素数，有无限个。质数定义是：在大于1的自然数中，除了1和它本身以外不再有其他因数的数称为质数。例如，2，3，5，7，11，13，17 ...

    3 年前
  • Java斐波那契数列实例

    Java基础实例程序 在斐波那契数列中，下一个数字是前两个数字的总和，例如：0,1,1,2,3,5,8,13,21,34,55等。斐波那契数列的前两个数字是0和1，第三个数字是前两个数字的和，...

    3 年前
  • npm 包 @javiercejudo/tap 使用教程

    简介 npm 是一个常用的 JavaScript 包管理器，提供了许多有用的包供前端开发者使用。@javiercejudo/tap 就是其中一个非常实用的包，它提供了一种方便的方式来使用单元测试框架 ...

    3 年前

相关推荐

    暂无文章