GraphQL API初学者指南

這篇文章是翻譯自Marion Schleifer的以下文章。
GraphQL API入門指南
*今天，我想向你展示如何使用Hasura GraphQL API建立無伺服器後端。在研究了GraphQL之後…*medium.com

通过使用Hasura GraphQL API来构建无服务器后端的方法。在了解GraphQL及其优点之后，学习如何为API创建新表。然后，将实际数据放入数据库中。当然，也会介绍如何建立表之间的关系。最后，学习如何使用mutation操作数据。在进行本教程时不需要了解有关GraphQL的知识。

目录
关于GraphQL
关于Hasura
创建项目
创建表
插入数据
查询
关系
对象关系
数组关系
多对多关系
变异
参与社区

关于GraphQL

GraphQL是一种为API设计的类型化查询语言。包括Facebook、Twitter、GitHub等大型企业在内，越来越多的技术企业正在从广泛使用的REST API转向GraphQL解决方案。GraphQL相对于其他类似REST的API架构的主要优点如下：

• わかりやすいクエリで必要なデータを正確に入手

 

• 信頼できる結果と役に立つエラーメッセージを入手

 

• データはサーバーを介さずに直接アクセスされるため、高速で軽量なアプリケーションになる

 

• 複数のURLを使用せずにリソースを連鎖させることなく、1回のクエリーで複数のリソースを取得

 

• すべてのデータに1つのエンドポイントを使用し、正しいデータアクセスには入力フィールドを使用できる

 

既存のアプリケーションにGraphQLを簡単に追加できる

这是一个示例查询：

对应的结果是：

就像你所看到的那样，查询非常直观，结果是可以预测的。你刚好得到了你想要的东西。

由于Web应用程序变得越来越复杂，因此需要更快速且简单易维护的解决方案变得更加重要。现在或许是检查GraphQL的好时机。但是，如何使用它呢？是否需要搭建自己的服务器？如何将其连接到前端？别担心，我将在接下来为您介绍这些方面。

关于Hasura

Hasura提供了一个在Docker容器中运行的开源GraphQL引擎。Hasura将连接到项目中创建的Postgres数据库。您还可以在现有项目上运行Hasura GraphQL，这对想要迁移到GraphQL的情况尤其方便，因为可以在少量的步骤中完成迁移。

GraphQL API可以部署在多个选项中，如Heroku、Docker、Digital Ocean、Azure、AWS和Google Cloud等。

创建项目

在这篇文章中，我们将介绍如何使用Heroku。我们将创建一个哈利波特的API?。

请使用以下链接创建一个新的Heroku应用程序：https://dashboard.heroku.com/new?button-url=https%3A%2F%2Fdocs.hasura.io%2F1.0%2Fgraphql%2Fmanual%2Fgetting-started%2Fheroku-simple.html&template=https%3A%2F%2Fgithub.com%2Fhasura%2Fgraphql-engine-heroku

请在仪表盘上选择您的 API 的（独特的）名称，并点击“部署”按钮。

很简单对吧。现在，只要你向下滚动到底，你就能看到这个：

点击「View」后，Hasura控制台将在GraphiQL工具中打开。这也是使GraphQL更易于使用的功能之一。在Hasura控制台中，您可以创建表格并测试查询。让我们来看看控制台吧。

1. 这是用来与API进行对话的（唯一的）端点。当从外部服务获取数据时，需要访问这个URL以进行轮询。您可以在这里确认，但GraphQL请求始终为POST请求。

 

1. 您可以在这里添加请求头。如果您希望稍后添加认证（例如使用JWT令牌），可以在这里添加标头。

 

1. 这是一个可以测试查询的领域。

 

1. 结果将在这里显示。

 

然后前往那里，并创建第一个表。

创建桌子

首先，创建一个用于存储电影的表。让我们开始吧！

1. 建议为所有的表添加一个ID字段。可以使用整数或UUID。我们将使用UUID。由于不需要每次创建对象时传递ID，Hasura会自动为我们创建它。

 

另外，需要为每个表定义一个主键。这将成为我们的ID。

请创建下面的两个表格。

角色（ID：UUID，姓名：文本，发色：文本，住所：文本，巫师：布尔值，出生年份：整数，守护兽：文本）

演员 (id: UUID, 名字: 文本, 出生年份: 整数, 奖项: 整数)

新增数据

我们来尝试添加数据：

我会再添加一个角色，两部电影和两位演员。

查询

有了数据后，您可以在GraphiQL中执行第一个查询。

此查询将返回已插入到 characters 表中的两个字符。

可以在查询中添加许多约束。例如，您可以仅获取特定数量的对象。或者，只获取满足特定条件的对象。所有这些都在Hasura网站上详细介绍了：https://docs.hasura.io/1.0/graphql/manuals/query/simple-object-query.html

通过阅读这份说明并微调查询，可能会得到不同的结果。为了实现这一点，可能需要进一步添加数据。

关系

目前，有三张相互独立的表。使用查询可以获取电影、角色和演员。但是，我们无法搜索具有这些性格的电影，也无法通过每个演员来找到电影。要实现这一点，我们需要定义关联关系。

在关系中，存在着对象关系和数组关系这两种类型。对象关系是一对一的关系。例如，character拥有一个被称为actor的单个嵌套资源。数组关系是一对多的关系。例如，movie中有一个被称为scene的嵌套资源数组。

物体之间的关系

首先，让我们对”character”和”actor”之间的关系进行建模。第一步是在”characters”表中添加”actor_id”一列。

添加actor_id列后，需要编辑它并确认actor_id实际上成为actors表的外键。

当你点击character的“关系”选项卡时，会显示提出的关系。是的，Hasura会自动检测外键并提出关系建议。作为名称，我们将使用“演员”。

接下来，将character连接到数据库内相应的actor。查看characters表时，可以发现之前创建的character的actor_id为NULL。可以通过编辑数据，为这些character添加与之对应的actor的id。

接下来，将character与数据库中对应的actor进行连接。查看characters表时，可以发现之前创建的character的actor_id为空。可以编辑数据，为这些character添加对应的actor的id。

这样一来，角色和演员就相互关联了。这样一来，你可以通过一个查询同时访问角色和演员字段。

数组的关系

数组关系是一对多的关系。也就是说，一个表的一个对象可以包含另一个表的多个对象。在这个示例中，一个电影可以包含多个场景，每个场景都属于一个电影。场景包括ID、名称、位置和电影ID。那么，让我们在数据库中创建一个名为”scenes”的新表。

太棒了！现在，我们需要像之前一样修改表格，把movie_id设为外键。

当你转到movies表并点击“Relationships”后，你可以了解到对于场景所提供的数组关系。你可以添加这个关系并称之为“scene”。要创建数组关系，只需要这样做即可。为了测试它，你需要在scenes表中插入一些行。

多对多的关系

正如之前所解释的，数组之间的关系是一对多的关系。但是对于电影和角色来说，存在多对多的关系。一个电影可以包含多个角色，一个角色也可以包含在多个电影中。在这种情况下，我们需要创建一个称为“movie_characters”的连接表。这个表可以存储一个电影和一个角色之间的关系。让我们创建一个带有ID、movie_id和character_id的“movie_characters”表。

从电影角度来看，movies表和characters表之间需要有对象的关联。这是因为每个movie_character内存储了一个电影和一个角色。

请编辑movie_character表中的movie_id和character_id两个字段，并选择它们成为外键的复选框。然后，请添加正确的参考表和参考列。对于movie_id字段，参考表是电影，而对于character_id字段，参考表是characters。对于两个参考列，它们将成为ID。

点击“关系”选项卡后，会显示出两个关于对象关系的建议。将它们都添加，并将它们命名为“电影”和“角色”。添加完成后，会呈现如下结果。

当然，需要根据上述情况创建与数据的关联。使用ID，对于每个电影和角色的关系，在movie_characters表中创建一行新数据。

太好了！所有的表都已经以正确的关系进行了建模。让我们用查询来测试一下吧。

这不是很好吗？只需一个查询，就可以使用所需的字段访问多个资源。与通常返回整个对象的REST相比，可以减少查询的基本要素。这样可以使API更加高效、轻量且易于处理。

突变

到目前为止，我们已经学习了如何通过API获取数据。但是，如何添加新数据呢？有时候我们也想添加电影或者角色。为了实现这一点，需要使用mutation。mutation在GraphQL API中很容易使用，并且像查询一样，可以在Hasura控制台上进行测试。

让我们解释一下在这里发生了什么。在mutation中，我们可以调用各种方法，如插入、更新和删除，来操作存储在数据库中的资源。本次操作是添加新的电影。我们需要将电影作为一个对象传递，并且可以在一个mutation中添加多个对象。最后，我们需要返回一些内容。在这个例子中，我们需要返回新创建的对象的ID。

请原谅我重复一遍，Hasura的网站上有关于mutation的完美说明。https://docs.hasura.io/1.0/graphql/manuals/mutations/index.html

请参照以下例子，尝试删除电影或尝试其他的变异操作。

今天就到这里吧。希望能够愉快地学习GraphQL，并且用许多新的表格和数据来拓展哈利波特API。如果有任何不清楚的地方，随时可以发送电子邮件到marion.schleifer@gmail.com，或者通过Twitter发送消息。https://twitter.com/rubydwarf。

敬请期待更新。我们将发布另一篇关于如何连接Hasura后端与VueJS前端的博客文章?。

来参加社区吧

Hasura越来越多的开发者开始使用。请加入友好的社群，获取最新信息。

如果你想在Hasura上开始自己的项目，你可以通过这个链接加入discord的频道：https://discordapp.com/invite/hasura。

已经有一个相当庞大的社区，你会很快得到帮助。

?推特：https://twitter.com/hasurahq

⭐️Github：https://github.com/hasura/graphql-engine
⭐️Github：https://github.com/hasura/graphql-engine

原文来源Medium的文章