学习 如何

GraphQL:完成困难任务的简单方法

发布时间:2020年9月11日

  • 领域
  • 舆图
  • GraphQL

通过凯伦Huaulme

布赖恩·伦纳德

分享

GraphQL在迅速普及的新标准使用API​​,这是很容易明白为什么!高性能和高效率,这项突破性的API查询语言为开发人员提供一个单一的API端点访问正是他们所需要的数据。关系和自定义的解析器让你进一步发展你的GraphQL API来访问多个数据源。有了这样的可扩展性,可以更快速迭代的前端采用您的应用程序的用户一定会喜欢。

在本教程中,我们将通过一个完整的例子走路只能用数据出发,打造出使用GraphQL整个网站 - 展示它为什么变得如此受欢迎。

首先,我们将在几分钟内为数据设置一个托管的、无服务器的、安全的GraphQL API。然后,我们将把这个API扩展到其他数据集合和自定义解析器,以便在同一个模式下将不同的数据源和API捆绑在一起。最后,我们将使用GraphQL端点构建一个web应用程序,以演示GraphQL如何准确地为我们提供所需的数据——不多也不少。

一路上,我们将学习如何

  • 自动生成你的MongoDB集合JSON模式。188金宝搏手机客户端安卓下载
  • 为该数据创建类型和解析器。
  • 定义自定义查询解析器来访问其它数据库或第三方的API。
  • 测试使用阿特拉斯界面内GraphiQL接口架构。

你喜欢通过视频来了解?要看到我们建立了我们的实时GraphQL应用程序,看看这个视频教程。

让我们先从数据

本教程假设你已经有了一个一个的MongoDB集群图集188金宝搏手机客户端安卓下载样本数据集装。如果不是,它是完全免费创建一个。我们的应用程序将使用sample_analytics数据集。这个数据库包含了一个典型的金融服务应用程序的不同类别:

  • sample_analytics.customers集合包含包括账户号码客户的详细信息。
  • sample_analytics.accounts集合包含每个客户的账户细节。每个文档包含ACCOUNT_ID和客户已购买的产品。

在下面的图片中,请注意在客户文档的帐户阵列指向ACCOUNT_ID场帐户文件中的值。

客户和帐户之间的关系

现在,让我们从我们的集群通过利用MongoDB的领域成立一个托管,无服务器暴露我们sample_analytics数据,并确保GraphQL API188金宝搏手机客户端安卓下载。这将只需要点击几下!

步骤1.创建BankingDogs领域的应用

188金宝搏手机客户端安卓下载MongoDB的境界,简单地说,是一个无服务器应用程序的后端,可以简化您的后端代码,以便您可以专注于前端的功能。我们将在本教程中使用的境界,不仅卸载的GraphQL后端和中间件层,而且要处理认证,模式创建和GraphQL查询。

里面你阿特拉斯UI,选择领域标签和创建一个新的应用程序。

创建领域应用

命名该应用程序,并将其与加载的示例数据链接到您的Atlas集群。我给我的申请命名BankingDogs。你为什么会很快看到。

群集的名称和链接

然后单击创建领域中的应用。现在我们也对我们的方式!

第2步:定义数据访问规则您的最爱

Realm为所有传入的GraphQL请求执行数据收集规则。所有GraphQL请求必须包含一个身份验证标记来识别登录用户的请求。域为GraphQL操作中包含的每个文档计算角色,只返回域用户有权查看的字段和文档。

我们将研究这个更详细以后,但现在选择规则菜单下的数据访问和安全在左边。然后单击添加收藏选择数据库sample_analytics账户收藏不使用集模板。选择所有其他字段读权限。这默认角色将适用于每个登录用户,并将允许读取所有字段。

定义规则的集合

模式

GraphQL是强类型。每GraphQL API符合一个“模式”。此架构的数据模型作为客户端和服务器之间的合同定义什么字段映射到什么类型的,什么类型的查询客户端可以使。因此,模式需要我们希望通过API来暴露任何字段创建。在即将到来的第3-6步,我们将创建一个从我们的数据模式,测试模式,并通过对其他数据收集的关系扩展架构。最后,在步骤7-8,我们将扩大我们的模式超越了简单的MongoDB我们的数据通过创建自定义解析器,包括第三方数据。188金宝搏手机客户端安卓下载

第3步:创建账催收架构

切换到模式选项卡并单击生成模式。一旦生成您的架构,以确保它是有效的,选择验证选项卡运行验证。, 然后评估与部署变化。

生成账户模式

这就是它!您创建了第一个GraphQL架构和端点。在这一点上,你已经做了所有你需要做的,你的MongoDB阿特拉斯数据表面上以客户端应用程序。188金宝搏手机客户端安卓下载即使你没有一个前端,你仍然可以测试您的端点和查询的境界界面中的数据。

箴提示!为了加速开发,您可以通过禁用草案来绕过审查和部署更改这一步骤。您将在Deploy >配置下找到该设置。

第4步:测试新的架构和API在GraphiQL

导航到GraphQL在左侧的菜单。这将打开探索与标签GraphiQLGraphQL IDE接口。

有几个令人兴奋的事情,这里要注意:

  • 你有你的GraphQL端点在应用程序中使用。
  • 你有你的GraphiQL界面,你可以测试出查询。
  • 您已经在文档资源管理器中自动生成了文档。
三点注意事项

文档

GraphQL最喜欢的方面是它的自我记录。你会发现在GraphiQL界面右侧的文件浏览器。点击进入询问你会看到查询字段现在是可用的:

文档资源管理器

帐户账户在为该集合生成此模式时为我们创建。最后,点击进入帐户看到返回的字段:_ID帐户ID限制制品

建立查询

GraphiQL提供了一个宝贵的工具,可以帮助您正确地组织GraphQL查询。切换到GraphiQL内部的查询窗口并滚动到底部(或者删除注释的帮助文本)。您可以看到返回帐户文档的第一个查询。点击运行将执行此查询,并在右侧看到响应。

查询账户

请随意阅读Document Explorer并在GraphiQL中使用您的查询。

第5步:创建一个自定义模式为客户收集

现在,您已经成功地创建并测试了GraphQL API端点账户数据,让我们重复上述步骤创建并通过点击验证为客户收集模式顾客集合中的左侧菜单。

创建客户模式

记得给各个领域的读取权限。生成的模式和验证。验证后,你会看到试图保存,当你得到一个错误信息。

错误
哎呀!

这是因为tier_and_details客户文档中字段。我们可以简单地删除这个领域,因为我们不再需要它在响应有效载荷反正。事实上,如果你有数据字段,你不想面到客户端应用程序,你可以简单地从您的架构中删除。点击删除配置

删除配置

现在回到模式和的标签,而不是自动生成的模式中,粘贴在下面的架构对象简单地去除tier_and_details字段:

              
1
2
3
4
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20.
21
22
23
24
25
26
27
28
29
{“标题”“顾客”“属性”:{“_id”:{“bsonType”“OBJECTID”},“户口”:{“bsonType”“阵列”“项目”:{“bsonType”“INT”}},“活性”:{“bsonType”“布尔”},“地址”:{“bsonType”“串”},“生日”:{“bsonType”“日期”},“电子邮件”:{“bsonType”“串”},“名称”:{“bsonType”“串”}}}
创建客户模式

现在您可以毫无问题地验证和保存了。一定要评估与部署变化。

让我们回到GraphiQL,你就可以开始查询客户资料的时候了:

客户查询

请注意你有EXACT同一端点正如您用于帐户收集的那样!还可以组合对这两个集合的调用,从而避免到服务器的多次往返。

客户和账户查询

请求作为多或尽可能少字段,你希望得到正是你想要的数据。这消除了取,降低响应有效载荷,并避免长时间页面加载时间。反过来,你会得到更好的应用性能,并能编写更干净的代码。

大交易

关系

我们可以用我们的模式来定义,在一个地方收集到一个或多个文档每个文档连接不同,或者所链接的MongoDB集群阿特拉斯国外,征收的关系。188金宝搏手机客户端安卓下载因此,让我们的客户连接到他们的帐户。创建客户之间的关系,占允许我们在GraphQL流利查询相关文件的读写操作。在我们的例子中,这将使我们能够查询顾客而不是仅仅得到了客户信息,而且产品的列表中为每个自己的账户,从一个呼叫账催收。

第6步:定义客户和账户之间的关系

要建立一种关系,回到规则为了顾客收藏,我们的本地收藏。还记得我们的顾客账户集合通过客户关系账户阵列指向帐户ID字段账户采集?让我们将它们链接的接口。添加关系在里面的关系标签:

关系

这是我们之间的关系确定指标:

关系的定义

占文档境界求值是与基于外键的值给定的客户文档。我们的关系定义foreign_key字段帐户ID。还要注意,is_list定义字段设置为真正。这表明,从一个客户的关系,是将多个账户的文件,因为局部场账户包含值数组。

这种关系现在被定义,境界可以流体返回客户所有的账户她在同一GraphQL查询。回到GraphiQL,请注意,我们为不再查询简单地从客户账户场。我们必须从相应的账户文件要求的字段按照在相关领域ACCOUNT_ID账户采集。在下面的例子中,我检索不仅从客户信息顾客集合,但也都来自于一个单一的与服务器通信相关的她她的帐户产品信息:

客户和账户查询

什么将传统上需要2个不同的API调用,现在可以通过一个调用来完成!

Twofer

自定义冲突解决

一个GraphQL的许多强大的一个方面是解决单个查询到多个后端资源的能力。来自GraphQL文档

每种类型每个字段由一个称为其由GraphQL服务器显影剂提供的旋转变压器的功能的支持。当执行一个字段,对应的解析器被调用来产生下一个值。

领域自动生成解析器在你的架构中定义的收藏领域。但是,您可能希望定义一个字段解析为的MongoDB数据库的东西之外。188金宝搏手机客户端安卓下载同定制解析器,您可以将不同的数据源捆绑在一起—无论是来自其他数据库还是第三方api—都在同一模式下。为了进一步扩展我们的GraphQL API以适应我们的用例,让我们创建一个自定义解析器来检索随机的狗图像和报价。毕竟,现在的世界需要更多的狗和幽默。

狗

第7步:创建getDogAndQuote功能

我们的定制解析器将指向此功能在定义什么被转换为实际GraphQL API的逻辑。在我们的银行应用程序,我们不仅希望得到客户的帐户信息,但我们也需要一个良好的笑时下。对于这一步,我们将使用从电脑报价API风暴咨询它提供了一个选择从计算机科学领域引号的 - 因为计算机科学是热闹!

下面是一个典型负载请求从一个随机报价http://quotes.stormconsultancy.co.uk/random.json

风暴咨询有效载荷

考虑到这一点,选择功能在左边的菜单:

功能

创建一个新的功能。

名称的功能getDogAndQuote。

狗和报价功能

然后切换到函数编辑器并替换为以下示例代码:

              
1
2
3
4
6
7
8
9
10
11
12
13
14
15
16
出口=异步功能{//从风暴咨询电脑报价API:常量quoteUrl =“http://quotes.stormconsultancy.co.uk/random.json”;常量quoteResponse =等待context.http.get ({网址:quoteUrl});常量quotePayload = EJSON.parse (quoteResponse.body.text ());常量报价= quotePayload.quote;常量作者= quotePayload.author;返回{引用:报价,作者:作者};}

您可以随意地包含您想要的错误处理:-)。

使用控制台在页面的底部点击运行验证您从API成功地获得引用和作者:

润报价功能

虽然我们顾客收集没有顾客的照片,我喜欢想象谁,我们正在使用,所以让我们使用狗API检索随机狗的照片。添加下面的代码行到你的境界功能和改变返回的对象,包括你的狗的形象。

              
1
2
3
4
6
7
8
9
10
常量dogUrl =“https://dog.ceo/api/breeds/image/random”;常量dogResponse =等待context.http.get ({网址:dogUrl});常量dogPayload = EJSON.parse(dogResponse.body.text());常量dogImage = dogPayload.message;返回{引用:报价,作者:作者,dogImage:dogImage};

然后评估与部署功能。

步骤8:创建自定义解析器

最后,要创建自定义解析器,选择GraphQL在左边,然后选择菜单自定义冲突解决标签:

添加自定义解析器

点击添加自定义解析。

我们希望允许客户在其GraphQL查询中插入一个新字段,该字段将返回狗的图像和报价。该GraphQL字段名称是字段的调用自定义解析器和名称父类型确定解析器是查询还是突变。将GraphQL字段名设置为DogAndQuote的父类型询问和功能的getDogAndQuote功能刚刚创建。

设置的inputType到没有,作为我们的解析器并不需要一个。将有效载荷类型来自定义类型有以下情况:

              
1
2
3
4
6
7
8
9
10
11
12
13
14
15
{“类型”“对象”“标题”“DogAndQuote”“属性”:{“引用”:{“类型”“串”},“作者”:{“类型”“串”},“dogImage”:{“类型”“串”}}}
创建自定义解析

标题“DogAndQuote”将被用来描述GraphQL文档中的有效载荷。总之,当王国GraphQL解析器看到现场“DogAndQuote”,它会调用函数“getDogAndQuote”得到的结果。

然后评估与部署自定义解析器。

切换到探索标签可以看到来自该DogAndQuote查询结果:

查询犬报价

良好的措施,让一些简单的客户数据添加到查询:

客户查询狗

在后台,来自多个数据源(MongoDB、QuoteAPI和Dog API)的数据通过一个188金宝搏手机客户端安卓下载查询获得——这要感谢Realm对自定义解析器的支持!现在,我们的客户端可以查询GraphQL并准确地获得他们想要的数据——不多也不少。

GraphQL到多个后端

查询过滤器和变量

我们目前GraphQL查询只是返回单个客户记录。我们可以应用过滤器来查询,以获得一个特定的客户。例如:

查询过滤器变

我们可以再进一步抽象此查询拉动名字到一个变量:

查询变量

让我们结束前端

现在我们已经构建了整个GraphQL后端,让我们在应用程序中使用它。在https://github.com/188金宝搏手机客户端安卓下载mongodb-developer/BankingDogs你会发现4个文件,这包括我们的BankingDogs Web应用程序。来吧,它们下载到应用程序文件夹。打开它们,让我们熟悉一下代码。

上的用户界面(BankingDogs.html),存在对客户名称形式输入。当按下回车键,应用程序将执行userAction功能BankingDogsScript.js文件。BankingDogsScript.js文件中,您将看到我们只有两个点的集成领域应用:

  • 第2行:Realm App ID
  • 第21行:GraphQL端点

您还将在第5行的通知,我们将需要登录的境界GraphQL凭据。按照步骤2所述,所有GraphQL请求必须包括令牌,以确定发出请求的登录的域用户的认证。境界内置的身份验证支持,使您的应用程序的认证实现快速,无痛的!

步骤9:启用匿名身份验证

在你的领域界面,导航到用户在左侧的菜单。在里面供应商标签,切换允许用户登录匿名对:

用户

匿名身份验证提供允许用户登录到您的应用程序无需提供凭据。

视频

由于我们的应用程序是很基本的,匿名身份验证充足。然而,境界提供了多种内置的认证选项,如电子邮件/密码,谷歌,Facebook,甚至自定义身份验证。要了解更多,请查看这个简短的视频教程:简介MongoDB188金宝搏手机客户端安卓下载的针:用针验证提供

步骤10:链接BankingDogs前端领域的应用

如前所述,线2和21是整合的唯一点为您的应用领域的前端。目前这些都在使用我BankingDogs应用程序的终点,而是继续前进,用自己的境界的App ID和GraphQL API端点替换它们。导航回GraphQL在左边的菜单来检索这些。

GraphQL端点
整合境界到前端

步骤11:插入GraphQL查询

通知书线29-44在我们BankingDogs.js文件,我们已经可以简单地剪切和直接从我们GraphiQL接口粘贴查询。

最后的查询将粘贴

您可以在我们还使用QueryInput来过滤特定用户的应用程序中看到:

              
1
2
3
4
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20.
21
22
23
24
25
26
27
28
常量RESP =等待爱可信({网址'https://realm.188金宝搏手机客户端安卓下载mongodb.com/api/client/v2.0/app/bankingdogs-ukaex/graphql'方法“后”:{“授权”`承载$ {} user.auth.activeUserAuthInfo.accessToken`},数据:{变量: {cust},查询`查询($卡斯特:字符串){客户(查询:{名称:$卡斯特}){名电子邮件地址帐户{ACCOUNT_ID产品}} {DogAndQuote笔者dogImage报价}}`}});

打开在开发工具的控制台,也会显示您的整个响应有效载荷。来吧,玩在GraphiQL和应用程序查询。

应用演示

包起来!

通过我们的BankingDogs应用教程的学习,我们看到我们的安全GraphQL服务器如何公开一个端点回应与正是我们的客户端应用程序所请求的数据 - 仅此而已,无所不及。这个简单性和灵活性导致更干净的代码,减小的有效载荷,优化的性能,并增加了显影剂的生产率。人们很容易看到的MongoDB领域的Gra188金宝搏手机客户端安卓下载phQL支持,使数据更加惊人容易与工作。

要了解更多信息,提出问题,请假反馈或简单地与其他MongoDB的开发人员交流,请访问我们的188金宝搏手机客户端安卓下载社区论坛。前来学习。保持连接。

对于我们的BankingDogs应用程序,我们只查询了一个角色的数据。如果你想多做一点。复杂的应用程序和使用突变和不同的角色,看看Drew DiPalma在MongoDB .live 2020上的演讲:188金宝搏手机客户端安卓下载在几分钟内创建复杂的GraphQL的API。

有关

视频:GraphQL:在简单的方法来硬的东西
GitHub库:BankingDogs
视频:境界在几分钟内创建复杂的API GraphQL
188金宝搏手机客户端安卓下载MongoDB的图标
  • 开发中心
  • 文档
  • 大学
  • 社区论坛

©M188金宝搏手机客户端安卓下载188博金宝app网站ongoDB的公司