首页 > web前端 > js教程 > React AWS Cognito:电子邮件身份验证设置指南(第一部分)

React AWS Cognito:电子邮件身份验证设置指南(第一部分)

Linda Hamilton
发布: 2024-11-07 16:47:03
原创
237 人浏览过

这是由两部分组成的系列中的第一部分,我们将使用 AWS Cognito 构建一个 React 应用程序,以进行基于电子邮件的用户身份验证。第 1 部分重点介绍设置必要的 AWS 配置,而第 2 部分将深入研究 React 代码,将它们结合在一起。

我们将使用以下 AWS 服务:

  • 亚马逊简单电子邮件服务 (SES)
  • AWS Cognito

让我们从设置 AWS 资源开始。

亚马逊简单电子邮件服务 (SES)

域SES身份

出于测试目的,验证 SES 中的域所有权是可选的,因为 AWS 提供了解决方法。但是,对于生产,验证所有权对于允许 SES 代表您的域发送电子邮件至关重要。

设置过程如下:

  1. 前往亚马逊简单电子邮件服务
  2. 选择身份
  3. 点击创建身份

在设置中,我选择“域”并使用示例domain.com。

React   AWS Cognito: Email Authentication Setup Guide (First Part)

  • 点击创建身份

然后,您将看到类似于此的页面:

React   AWS Cognito: Email Authentication Setup Guide (First Part)

导航到发布 DNS 记录部分,并使用这些值在您的域名提供商中添加记录。

在您的域名提供商中设置 DNS 记录后,您应该会看到您的域名已验证,如下所示:

React   AWS Cognito: Email Authentication Setup Guide (First Part)

完美,您的域现已验证,这允许 SES 代表您发送电子邮件。由于 AWS 提供了替代方法,因此测试不需要此验证,但它对于生产至关重要。

电子邮件 SES 身份

测试时,此步骤很重要,因为您在身份验证流程中使用的电子邮件地址需要添加到 AWS 的“允许列表”中。在这里,我们将添加并验证电子邮件地址。

前往:

  • 亚马逊简单电子邮件服务
  • 身份
  • 创建身份

这次,选择电子邮件地址

  • 输入您要验证的电子邮件地址。
  • 点击创建身份

React   AWS Cognito: Email Authentication Setup Guide (First Part)

创建身份后,您将收到一封来自 AWS 的电子邮件,其中包含验证链接。请务必检查您的收件箱并单击该链接以验证您的电子邮件。

React   AWS Cognito: Email Authentication Setup Guide (First Part)

验证电子邮件后,您应该会看到一个表明其已验证的标签。

React   AWS Cognito: Email Authentication Setup Guide (First Part)

此时,您应该已验证您的域名和电子邮件。虽然域验证在测试期间是可选的,但在生产中却是必需的。另一方面,测试需要电子邮件验证,但生产不需要。

注意:作为身份验证流程的一部分,确认码将发送到此电子邮件帐户。如果电子邮件帐户未经过验证,则不会收到代码。

亚马逊认知

要配置的最后一个部分是Cognito。此服务启用帐户身份验证,在本例中,我们将使用 电子邮件 进行身份验证。其工作原理如下:

  • 用户使用他们的电子邮件和密码创建一个帐户。
  • 他们通过输入 AWS 发送的代码来验证他们的电子邮件。
  • 验证后,用户可以使用他们的电子邮件和密码登录。

您可以利用 AWS Cognito,而不是自己处理身份验证。

我们去:

注意:对于大多数步骤,我坚持使用默认选项,因此我只会提及我所做的自定义选择。根据您的项目,您可能需要配置不同的设置。

  • 认知
  • 创建用户池
  • 第 1 步:检查电子邮件

React   AWS Cognito: Email Authentication Setup Guide (First Part)

  • 第2步:选择无MFA;这对于测试来说不是必需的。

React   AWS Cognito: Email Authentication Setup Guide (First Part)

  • 第3步:我保留默认选项。

React   AWS Cognito: Email Authentication Setup Guide (First Part)

  • 第 4 步:选择您经过验证的“发件人电子邮件地址”。

Cognito 将发送一封包含验证码的电子邮件,最好来自您的域,这就是为什么需要在上一节中验证域的原因。在这里,您可以看到 AWS 提供了适合开发的选项“使用 Cognito 发送电子邮件”。但是,在生产中,您需要确保您的域经过验证,以便实现更专业、更可靠的电子邮件发送过程。

React   AWS Cognito: Email Authentication Setup Guide (First Part)

  • 第5步:除了添加池和客户端名称之外,关键部分是展开“高级应用程序客户端设置”并启用ALLOW_USER_PASSWORD_AUTH。此设置允许用户使用其电子邮件和密码进行身份验证,这对于您的身份验证流程至关重要。

React   AWS Cognito: Email Authentication Setup Guide (First Part)

  • 第6步:这是审核步骤,这里没有什么可以编辑的。在继续之前,请确保一切看起来都很好。

创建后,您应该在仪表板上看到它,如下所示:

React   AWS Cognito: Email Authentication Setup Guide (First Part)

就是这样!您现在已在 AWS 上完成所有设置。在下一篇文章中,我将演示如何将 React 应用程序与 Cognito 连接,以使用用户的电子邮件对用户进行身份验证。请留意下周一发布的帖子。

以上是React AWS Cognito:电子邮件身份验证设置指南(第一部分)的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板