如何用Auth0和Twilio启用多因素认证

110 阅读7分钟

你的用户与你的企业最值得信赖的互动是当他们在键盘上输入每个字母,把他们的用户名和密码输入你的登录框。在他们敲击回车键并通过互联网管发送这些机密信息后,他们相信你的应用程序已经尽了一切可能来保护他们的数据安全,不被坏人利用。

即使有适当的协议,专业的攻击者仍然会找到捷径和后门来访问用户的凭证和机密信息。好消息是,你可以通过在你的应用程序中添加多因素认证(MFA),为你的用户增加另一层保护。MFA让你增加另一个验证因素,以便用户能够证明他们所说的身份。有几种类型的MFA方法。其中一些是基于短信、一次性密码(OTP)、认证器应用程序和生物统计学,仅举几例。

要了解更多关于MFA方法的信息,请查看这个MFA指南

今天,你将使用Twilio作为短信提供商,用Auth0添加基于短信的MFA。Twilio是一个流行的客户参与平台,你可以轻松地与Auth0集成。

如果你愿意,你也可以观看这个关于同一主题的视频。

你需要什么?

  • 一个Auth0账户,如果你还没有,你可以免费注册
  • 一个Twilio账户
  • 一个移动电话

设置和配置Auth0 React演示应用程序

如果你已经在你的Auth0仪表板上注册了一个单页应用程序,你可以跳到创建Twilio账户和获取证书

克隆演示应用程序

首先,从GitHub上克隆Auth0 React SDK示例应用程序。这是一个设置好的React应用样本,并与Auth0连接。一旦你在你的机器上安装了该应用程序,cdauth0-react-samples然后再次进入 Sample-01,使用npm来安装项目的依赖项。

npm install

一旦依赖项安装完毕,在终端运行npm run dev ,并在浏览器中访问 http://localhost:3000,如果它没有自动启动。现在你会看到React样本项目,在屏幕的右上角有一个登录按钮。

Auth0 Sample Project Login Screen

在项目的src 文件夹中,你会找到 auth_config.json.example文件。这个文件里面有一个带有占位符值的JSON对象。复制它,然后在同一文件夹中创建一个新文件,命名为 auth_config.json.创建了这个文件后,你需要用你自己在Auth0仪表板上的凭证来替换占位符的值。

Auth0 Config File

从Auth0仪表板获取证书

现在进入你的Auth0仪表板;点击应用程序,然后在右侧面板的选项下拉菜单中再次点击应用程序。如果你的Auth0账户中还没有一个应用程序,请点击创建应用程序。

Auth0 Dashboard Application Page

在创建应用的屏幕上,你要给你的应用起一个名字。你可以使用 "Twilio MFA测试"。

接下来,你将选择应用类型;选择单页应用,因为这是一个React应用。然后点击创建

Auth) Dashboard Create Application Page

由于你的机器上已经有了样本应用程序,跳过快速启动,点击设置。在这里你可以找到你需要替换文件中的占位符值的域名和客户ID。 auth_config.json文件中的占位值。你可以把这些值从仪表板上复制到你的代码编辑器中。

Application Settings Page

接下来,向下滚动到应用程序URI部分,填写允许的回调URL、允许的注销URL和允许的网络源头。这个例子是在本地运行的,所以在每个字段中输入 http://localhost:3000到每个字段中。当你完成后,滚动到页面底部,点击保存更改

Application URIs

现在你可以再次在本地运行该应用,并点击登录;输入用户名和密码,用户将成功通过Auth0认证。你可能已经注意到,用户名和密码是唯一用于验证用户的因素。通过添加另一个因素让用户验证,使你的应用程序更加安全。Twilio可以添加基于短信的认证。接下来你要设置一下。

创建Twilio账户并获取证书

如果你还没有一个Twilio账户,你可以在这里创建一个。一旦你创建了一个账户并登录,你会看到Twilio控制台。在这里你会看到你的账户SID和Auth Token,你以后会用到它们。新Twilio账户的下一步是获得一个Twilio电话号码。这将是在你的用户用用户名和密码登录后,向他们发送一次性密码的号码,以验证和完成他们的认证。

获取一个Twilio试用电话号码

在Twilio控制台,点击获取一个试用电话号码。你会自动得到一个号码,点击选择这个号码。这个号码现在将显示在项目信息部分的电话号码下。

配置Auth0以使用Twilio进行MFA

回到你的Auth0仪表盘,看一下骑行侧的菜单,点击安全,然后是多因素认证。在这个页面上,你会看到所有你可以使用Auth0的因素选项。对于这个应用,点击电话留言

在电话留言页面,你需要做的第一件事是点击左上角的切换按钮,启用电话留言MFA。你会看到一个弹出的通知,确认它已被启用。

接下来,你需要选择一个交付供应商;你会看到Twilio是列出的选项之一,这使得Twilio很容易连接到你的Auth0账户。对于选择交付方式,你有短信、短信和语音或语音可供选择。为了简单起见,选择短信。

Phone Message Settings Page

当你选择Twilio作为交付供应商时,你会有一些新的字段出现,输入Twilio SID、Twilio AuthToken和发件人电话号码。你会在Twilio控制台看到所有这些值。

Twilio Console

把每个值复制到Auth0仪表板中的匹配字段。这两个模板字段可以定制用户被发送的信息。在这个例子中,你会让这些字段保持原样。现在点击保存

Phone Message Twilio Settings

现在你已经配置好了一切,可以使用Twilio作为短信MFA供应商,但还有一个步骤可以让一切真正发挥作用

在Auth0仪表板中启用MFA

回到多因素认证页面,有两个部分:因素(我们刚刚完成)和定义策略。定义策略将告诉Auth0你想何时提示用户使用MFA。在 "要求多因素认证 "部分,默认是 "从不",这与你在做了那么多配置MFA的工作后希望做的事情完全相反。

第二个选项是一个叫做自适应MFA的插件。这需要看一下用户的环境,并决定是否有风险,需要另一个认证因素。在这个例子中,你将选择总是,然后点击保存

Define Policies Section

你会收到一个提示,询问你是否要继续,并让你知道所有新的和现有的用户现在都需要注册MFA,点击继续。这将更新你的MFA政策,现在,当用户注册或登录时,他们将看到一个提示,即添加他们的电话号码以注册MFA。

现在,在你的应用程序中启用了所有的MFA,你要测试它以确保一切顺利。

测试登录时的MFA

在你的样本应用程序运行时,点击登录,并输入你的电子邮件和密码。接下来,你会被提示添加一个电话号码以确保账户安全。这就是你的用户在你启用MFA后,下次登录时看到的内容。

你可以在第一行选择你所在国家的代码,然后输入你的电话号码并点击继续。然后,你的手机会收到一条短信,里面有一个验证码。将该代码输入你的应用程序的输入框中。

现在你已经成功登录了,你的用户又多了一层保护,防止他们的数据被泄露。这一切都要感谢你,拍拍你的肩膀吧

摘要

你刚刚使用Twilio作为供应商为你的应用程序添加了多因素认证。你把你的Auth0凭证输入到 auth_config.json在你的应用程序的项目文件中。然后,你在Auth0仪表板中启用了电话信息MFA,并添加了你的Twilio凭证。