如何在 Node.js 应用程序中使用 GraphQL

前言

GraphQL 是一种用于 API 的查询语言和运行时环境,由 Facebook 开源。它不同于传统的 RESTful API,具有类型检查、强大的查询功能和灵活的响应数据格式等优点,已经被越来越多的公司和开发者所接受和使用。

本文将介绍如何在 Node.js 应用程序中使用 GraphQL,并为读者提供深度的学习和指导。在阅读本文前,需要读者已经具备一定的 Node.js 和 GraphQL 基础知识。

安装与配置

在 Node.js 中使用 GraphQL,需要安装 graphqlexpress-graphql 两个模块。graphql 模块提供了构建和执行 GraphQL 查询的核心功能,而 express-graphql 则增加了一个 Express 中间件用于处理 GraphQL 请求。

安装命令为:

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

在应用程序中引入模块:

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

构建 GraphQL Schema:

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

创建 Express 应用程序:

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

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

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

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

启动应用程序,并访问 http://localhost:3000/graphql,可以看到 GraphiQL 工具界面。

输入以下查询语句:

-
  -------
-

点击运行按钮,可以在右侧查看结果:

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

基本类型

GraphQL 支持的基本类型包括 Scalar、List 和非空类型。

Scalar 类型用于表示基本数据类型,如字符串、数字、布尔值等。GraphQL 提供了以下几种 Scalar 类型:

Scalar 类型 描述
Int 有符号 32 位整数类型
Float 有符号双精度浮点类型
String Unicode 字符串类型
Boolean 布尔类型
ID 标识符类型,用于唯一标识对象

List 类型用于表示数组类型,可以使用中括号将其包裹。例如,以下类型定义表示一个字符串数组:

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

非空类型用于表示必填字段,可以在类型名称后面添加一个 ! 告诉 GraphQL 该字段是非空类型。例如,以下类型定义表示一个必须包含 name 字段的对象类型:

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

数据源

在实际项目中,通常需要从数据库或外部 API 中获取数据。可以通过定义 Resolvers 来完成与数据源的交互。

Resolvers 是一个返回包含字段值的对象的函数。每个字段都有一个 Resolver,当查询中包含该字段时,会执行该 Resolver,并返回对应的数据。

以下是一个简单的数据源示例,使用了 lodash 模块模拟了一个人员列表:

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

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

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

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

定义 Resolver:

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

修改 Schema:

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

以上代码中,PersonType 是一个自定义类型,使用了上文所述的非空类型和列表类型。

Mutation

除了查询外,GraphQL 还支持修改数据的操作,称为 Mutation。与查询类似,Mutation 也可以定义自己的类型和 Resolvers。

例如,以下是一个简单的 Mutation 示范,用于向人员列表中添加新的人员:

声明 Mutation Type:

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

定义 Resolver:

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

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

修改 Schema:

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

在 GraphiQL 中执行以下 Mutation 语句:

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

可以看到返回值中包含新添加的人员信息:

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

总结

本文介绍了如何在 Node.js 应用程序中使用 GraphQL,从安装和配置开始,逐步深入讲解了 GraphQL 的基础概念、基本类型、数据源和 Mutation 等内容,并提供了示例代码供读者参考。

希望本文对读者能有所帮助,更多 GraphQL 相关知识,请阅读官方文档。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/648acdc448841e98949009b5


猜你喜欢

  • 如何在 Deno 中使用 GraphQL 进行数据查询

    在前端开发中,数据查询是一个非常重要的任务。GraphQL 是一个强大的查询语言,可以帮助我们轻松地查询数据。在本文中,我们将介绍如何在 Deno 中使用 GraphQL 进行数据查询,并提供一些示例...

    1 年前
  • Kubernetes 部署 ELK 日志分析平台流程详解

    前言 Kubernetes 是一个用于自动化部署、扩展和管理容器化应用程序的开源平台。它能够让我们更方便地构建高可用、高可靠的分布式系统。而 ELK 则是一个非常流行的用于日志分析的平台。

    1 年前
  • Enzyme 中如何处理 Redux Store 及全局 Context

    Enzyme 中如何处理 Redux Store 及全局 Context 在前端开发中,处理 Redux Store 及全局 Context 是非常常见的需求。Enzyme 是一个流行的 JavaSc...

    1 年前
  • 在 Webpack 中解决 ESLint 报错:Unexpected Token < 问题

    在前端开发中,ESLint 是一款用于检测 JavaScript 代码中潜在错误的工具。然而,在使用 Webpack 时,我们可能会遇到一个常见的问题:ESLint 报错 "Unexpected To...

    1 年前
  • Koa 中使用 PM2 进行进程管理

    背景 在 Node.js 应用程序的开发过程中,使用一个可靠的进程管理器是非常重要的。进程管理器能够帮助我们轻松地管理 Node.js 应用的生命周期,从而提高应用的可靠性和稳定性。

    1 年前
  • PM2 如何实现 Node.js 应用的自动数据库迁移

    在 Node.js 开发过程中,常常需要进行数据库迁移,以升级数据库结构或添加新的数据表。而对于大型应用和部署在不同环境的应用来说,手动执行数据库迁移可能会很麻烦和容易出错。

    1 年前
  • CSS Flexbox 实现背景图片自适应填充容器的方案

    在前端开发中,背景图片的自适应填充容器是一个常见的需求。Flexbox 是 CSS 的一个布局模式,可以帮助我们实现这个需求。本文将介绍如何使用 CSS Flexbox 实现背景图片自适应填充容器的方...

    1 年前
  • Tailwind CSS 中如何实现多行文本样式的调整

    介绍 Tailwind CSS 是一款高效的 CSS 框架,它允许开发人员通过简单的 HTML 类来快速构建样式。它的设计理念是使用类似于函数式编程的方式来定义样式,而非传统的 CSS。

    1 年前
  • 在 PWA 应用中如何使用 Web Socket 实现通信

    PWA (Progressive Web Apps) 是一种越来越流行的 Web 应用程序开发方式,在 PWA 中使用 Web Socket 实现通信也越来越常见。

    1 年前
  • 使用 Babel 和 Webpack 实现在线编辑器实战

    使用 Babel 和 Webpack 实现在线编辑器实战指南 随着 Web 应用的发展,越来越多的用户需要在浏览器中进行代码的编辑和运行。而为了满足这个需求,我们可以利用前端技术来实现一个在线编辑器。

    1 年前
  • 当别人的 CSS Reset 不够用,你可以自己写

    当别人的 CSS Reset 不够用,你可以自己写 在前端开发中,使用 CSS Reset 已经是十分常见的做法。然而,有时候我们发现别人的 CSS Reset 并不能完全满足我们的需求。

    1 年前
  • Mongoose 中的联合查询使用详解

    Mongoose 是一个优秀的 Node.js ORM 框架,它可以简化与 MongoDB 的交互,并提供一系列直观的操作接口。Mongoose 中的联合查询是指在查询时,通过使用 $lookup 聚...

    1 年前
  • 为什么使用 ECMAScript 2020 代替一般 JavaScript?

    如果您是一位前端工程师,那么您一定熟悉 JavaScript,这是一个运行在浏览器中的脚本语言。它是前端开发中必不可少的一部分,用于为网站或应用程序添加交互性和动态性。

    1 年前
  • 在 LESS 中使用 calc() 函数进行加减乘除的方法

    在 LESS 中使用 calc() 函数进行加减乘除的方法 LESS 是一种比 CSS 更加灵活和强大的样式表语言,它提供了很多实用的特性,能够帮助我们更加高效地编写样式代码。

    1 年前
  • 如何更好地使用 Google Web Components

    在前端技术不断推陈出新的今天,Google Web Components 作为一个前端框架备受关注。Google Web Components 提供了一种基于 Web 标准的组件化方式来构建现代 We...

    1 年前
  • 在 Custom Elements 中使用 IndexedDB 进行本地数据存储

    在 Custom Elements 中使用 IndexedDB 进行本地数据存储 在前端开发中,我们经常需要在应用程序中存储一些本地数据,例如用户配置、缓存的数据等。

    1 年前
  • 如何使用 next.config.js 进行配置优化

    介绍 Next.js 是一个高性能、可扩展的 React 应用框架。它自带了许多开箱即用的功能,如自动代码分割、服务端渲染、静态导出等。然而,Next.js 还可以通过一个名为 next.config...

    1 年前
  • ECMAScript 2019:理解 Web Components

    随着 web 技术的不断发展和进步,越来越多的开发者开始关注并使用 Web Components 这一技术实现 web 应用的开发和部署。作为一种标准化的组件化技术,Web Components 为 ...

    1 年前
  • CSS3 如何应用在响应式设计中

    随着移动设备的普及,越来越多的网站需要支持响应式设计。响应式设计可以让网站在不同的设备上以最佳的方式展示内容,从而提供更好的用户体验。在实现响应式设计时,CSS3 引入了很多新的特性,让我们更方便地实...

    1 年前
  • 如何在 Fastify 应用中使用 Lodash 工具库

    Lodash 是一款使用广泛的 JavaScript 工具库,提供了许多实用的函数。它可以帮助我们在前端开发过程中更快、更方便地完成一些操作。本文将介绍如何在 Fastify 应用中使用 Lodash...

    1 年前

相关推荐

    暂无文章