GraphQL 已经成为了现在前端开发的热门技术之一，它提供了一种更加高效、灵活的方式来处理数据。在 GraphQL 中，前端可以精确地请求需要的数据，而且与获取所请求数据的方式无关。这种设计理念为前端开发者提供了一种非常方便的方式，而且让后端处理数据成为了一项更加简单的任务。
本文将介绍 Hasura 这一 GraphQL 工具，探讨如何使用 Hasura 来快速构建 GraphQL API，并使用示例代码进行演示。我们将逐步讲解 Hasura 的基本概念、如何配置 Hasura，以及如何查询和修改数据。
简介
Hasura 是一个 GraphQL 引擎，它允许你将现有的 Postgres 数据库转化为一个实时的 GraphQL API。Hasura 背后的目的是为用户提供一个易于维护、强大、高效的 GraphQL API。Hasura 完全免费，非常容易安装和配置，因此它广受开发者欢迎。
安装 Hasura
要安装 Hasura，需要使用 Docker。首先，你需要在系统上安装 Docker 和 Docker Compose。完成安装后，执行以下命令来下载和运行 Hasura API：
$ docker run -d -p 8080:8080 hasura/graphql-engine
如果运行成功，你应该可以在浏览器中通过 http://localhost:8080/console 访问 Hasura 控制台。
创建数据库和表格
在 Hasura 中创建数据库和表格非常容易。控制台提供了一个直观的界面，让你可以轻松地定义数据库架构。创建数据库和表格之前，你需要确保 Hasura API 正在运行。
创建数据库
要在 Hasura 中创建新的数据库，打开控制台并导航到“Data”选项卡。在左侧导航栏中，点击“Create a new database”。在弹出的窗口中，输入数据库名称并点击“Create Database”按钮。
创建表格
要创建新表格，请单击导航栏上的“Create Table”按钮。在弹出的窗口中，输入表格名称和列名。 Hasura 将自动为你生成数据类型和约束，你可以根据需要更改这些定义。完成后，点击“Create Table”。
构建 GraphQL 查询
完成数据库和表格的创建后，我们将学习如何通过 Hasura 执行 GraphQL 查询。为此，我们首先需要定义一个 GraphQL 查询文档。
下面是一个简单的例子。将以下代码保存为 countries.graphql 文件：
query { country { id name code } }
此查询将返回所有国家的 ID、名称和代码。
查询数据
有了查询文档之后，我们需要在 Hasura 中创建相应的 GraphQL API。在控制台中，导航到左侧窗格的“GraphiQL”选项卡。这个页面包含了一个查看 GraphQL API 的交互式工具。我们可以通过它来发送查询文档并查看返回结果。
首先，输入以下命令，将查询文档粘贴到请求正文部分：
{ "query": "query { country { id name code } }" }
然后，点击“Play”按钮，Hasura 将返回与查询文档匹配的结果集。使用这个方法，你可以轻松地构建和测试我们的 GraphQL API。
修改数据
Hasura 非常灵活，它不仅可以查询数据，还可以修改数据。要在 Hasura 中更新数据，你需要创建一个修改函数。
为了演示这一点，我们将创建一个新的 province 表格，然后定义一个修改函数将数据写入到这个表格中。
创建表格
在 Hasura 控制台中选择“Data”选项卡，并创建一个名为 province 的新表格。在左侧窗格中，输入以下表格定义：
CREATE TABLE province ( id SERIAL PRIMARY KEY, name TEXT NOT NULL, population INT NOT NULL DEFAULT 0 )
点击“Save”。Hasura 将根据该表格定义创建一个新的表格。
创建修改函数
要创建修改函数，请转到“Actions”选项卡，并创建一个名为 add_province 的新函数。在左侧窗格中，输入以下函数定义：
-- -------------------- ---- ------- ----- ------------ - ----- ------ - -------- -- -- - ----- ----- - - ------ ---- -------- ------ ----------- ------ ---- --- --------- - -- ----- ------ - ----------- ----------------- ----- ------ - ----- --------------------- -------- ------ - -------- ----- --------- --------------- -- -- -------------- - -------------展开代码
这个修改函数向 province 表格中插入一条新纪录，并返回结果集。
调用修改函数
为了调用修改函数，我们需要撰写一个新的 GraphQL 查询文档。将以下代码保存为 addProvince.graphql 文件：
-- -------------------- ---- ------- -------- ------------------ -------- ------------ ----- - ------------------ ------ ----------- ------------ - ------- -------- - -- ---- ---------- - - -展开代码
上面这个查询文档是一个变量化查询，它将 name 和 population 作为变量传递到 add_province 函数中。变量化查询可提供更高的可重用性和安全性。
加载查询文档之后，我们需要设置查询所需的变量值（在这种情况下是 name 和 population）。使用如下命令，将变量列表粘贴到窗口中：
{ "variables": { "name": "Ontario", "population": 14733119 }, "query": "mutation AddProvince($name: String!, $population: Int!) {\n add_province(name: $name, population: $population) {\n success\n province {\n id\n name\n population\n }\n }\n}\n" }
接下来，点击“Play”按钮，Hasura 将执行这个更新操作并返回结果集。此时，我们的 province 表格中已添加一条新的记录。
小结
在本文中，我们通过一些 Hasura 示例代码演示了如何构建 GraphQL API，并且介绍了如何使用 Hasura 查询和修改数据。 Hasura 是一个非常强大和灵活的 GraphQL 引擎工具，你可以很容易地将它与 Postgres 数据库集成。我希望本文对于前端开发者能够起到一定的指导作用，并且在实际开发中提供帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67806925ce7f4861253ab2c2
