如何使用 GraphQL 和 Prisma 构建数据库访问层

阅读时长 9 分钟读完

前言

作为一名前端工程师,我们经常需要处理数据,而数据库是存储数据的重要部分之一。通常情况下,前端工程师需要调用后端 API 才能访问数据库中的数据。而在一些小型项目中,通过使用 GraphQL 和 Prisma,前端开发人员也可以轻松地构建自己的数据库访问层。

在本文中,我们将介绍如何使用 GraphQL 和 Prisma 构建数据库访问层,并提供示例代码帮助你理解如何实现。

GraphQL 简介

GraphQL 是一种数据查询语言,由 Facebook 开发而来。相对于传统的 REST API,GraphQL 具有更高的灵活性和可扩展性。GraphQL 的核心思想是 “只请求所需数据”,前端开发人员可以仅仅请求需要的数据,并仅仅获取所需的数据,而不用像 REST API 那样获取整个数据资源的所有数据。

比如,假设我们需要获取一篇文章的信息,我们可以使用以下查询:

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

GraphQL 会从数据库中获取所请求的数据,并将其以 JSON 对象的形式返回。前端开发人员可以根据这些数据来渲染 UI。

Prisma 简介

Prisma 是一个开源的 ORM(对象关系映射)工具,它可以自动生成 GraphQL API 和数据库访问层。使用 Prisma,我们可以简化数据库连接和数据管理,甚至可以跳过后端开发人员,直接使用 Prisma 与数据库进行交互。

Prisma 支持多种数据库,包括 MySQL、PostgreSQL 和 SQLite 等。在本文中,我们将以 PostgreSQL 为例进行讲解。

使用 Prisma 构建 GraphQL API

在介绍如何使用 Prisma 构建 GraphQL API 之前,我们需要先确保已安装以下软件:

  • Node.js(版本不低于 10)
  • Docker

安装完成后,我们可以使用以下命令来创建一个新的 Prisma 项目:

执行以上命令后,Prisma CLI 会引导你完成项目初始化过程,并且创建一个空的 Prisma 服务。接着,我们可以在 prisma/schema.prisma 文件中定义我们的数据模型,例如:

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

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

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

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

在上述数据模型中,我们定义了 User、Post 和 Comment 三个数据模型,每个数据模型都包含多个属性。例如,Post 数据模型中包含了 title、content 和 author 三个属性,其中 author 属性与 User 数据模型建立了数据关系。

接着,我们可以使用 Prisma CLI 来创建数据库迁移并将数据模型应用到数据库中:

执行以上命令后,Prisma CLI 将会创建一个数据库迁移,并将我们定义的数据模型应用到数据库中。接着,我们可以使用以下命令来启动 Prisma 服务:

执行以上命令后,Prisma 会启动一个本地的 web 服务,我们可以通过访问 http://localhost:5555 在浏览器中打开 Prisma Studio,用于管理数据库中的数据。

到这里,我们已经成功地使用 Prisma 创建了数据库,并在其中应用了我们定义的数据模型。

使用 GraphQL 查询数据

在我们成功创建数据库之后,我们可以开始使用 GraphQL 来查询数据库中的数据。为了使用 GraphQL,我们需要安装 graphql-yoga 这个库:

接着,我们可以创建一个 index.js 文件,并添加以下代码:

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

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

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

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

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

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

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

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

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

在以上代码中,我们定义了一个 GraphQL 服务器,它包含三个数据查询字段(users、posts 和 comments)以及三个数据模型(User、Post 和 Comment)。

每个数据查询字段都对应了一个 Prisma 客户端方法,用于获取数据库中的数据。而每个数据模型字段都包含了一个 resolver 函数,它与 Prisma 数据库的查询方法对应。

接着,我们可以使用以下命令来启动 GraphQL 服务器:

执行以上命令后,GraphQL 服务器将会启动,并将使用 Prisma 客户端方法来查询数据库中的数据。我们可以通过访问 http://localhost:4000 来打开 GraphQL Playground,尝试使用 GraphQL 查询数据。

例如,假设我们需要获取所有用户的信息,我们可以使用以下查询:

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

GraphQL 服务器将返回一个 JSON 对象,其中包含了查询结果。

结论

通过使用 GraphQL 和 Prisma,前端工程师可以轻松构建自己的数据库访问层,而无需专业的后端开发人员帮助。在这篇文章中,我们详细介绍了如何使用 GraphQL 和 Prisma 构建数据库访问层,并提供了示例代码帮助你理解如何实现。希望这篇文章能够对你在构建前端项目时有所帮助。

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

纠错
反馈