Get best of the week

我如何在React和React Native Part 1上配置Azure AD B2C的故事（教程）

图片

前言


我们正在开发跨平台软件，并且面临着“建立通用授权系统”的任务。

必须为这三个应用程序建立一个公共的用户数据库，但是同时，每个应用程序都有其自己的独特功能。我们也有通用的微服务，我们希望从一个来源生成和验证令牌。因为 我们使用Azure服务，选择权取决于Azure AD B2C。当您设置所有这些东西时，就会发现一堆陷阱。我将整个故事分为几个部分：

  • 第1部分：在Azure AD B2C上构建和配置应用程序
  • 第2部分：使用身份框架经验
  • 第3部分：React应用程序连接
  • 第4部分：React Native App Connection
  • 第5部分：在.NET Core 3上连接和配置后端

在Azure AD B2C上构建和配置应用程序


要创建Azure B2C：

1.在Azure门户上，在搜索栏中输入“ Azure B2C”

图片

。2.执行本教程中的所有步骤

接下来，用户有两个选择：

  1. 使用基本用户线程
  2. 创建自定义用户流。

即使您要使用自定义用户流，也仍然需要在基本用户流上创建一个应用程序


根据我的经验-在基本流中，您可以使用大多数必要的功能，即：

  1. 用于授权的自定义页面。
  2. 选择要收集的有关用户的数据
  3. 在令牌中发送什么数据。

但

  1. 您无法发送自定义字母以确认邮件
  2. 您不能使用自己的值创建字段

基本用户线程


要创建基本的用户流：

1.转到应用程序注册部分（预览）

2.单击“ 新注册”
。我们将看到以下图片：

图片

3.选择一个选中标记
任何组织目录或身份提供者中的帐户。选择此选项可在Azure AD B2C中进行身份验证。

自定义基本流的步骤（仅在您不想自定义时才需要）
« » « ». :

image

, Azure \ .. :

image

:


自定义用户流


要创建自定义用户流，您需要转到创建的目录并创建两个应用程序：

  1. 身份体验框架
  2. ProxyIdentityExperienceFramework

图片

关于如何在这里创建它们。

我已按照“应用程序注册（初步版本）”中的指示进行了所有操作。

在这里，第一个陷阱已经出现，这使我陷入昏迷。

说明中的步骤之一说明：
在“高级设置”部分中，启用“将应用程序作为公共客户端进行处理（选择是）”。

并且以下按钮应该出现在ProxyIdentityExperienceFramework应用程序中：

图片

却不会出现（顺便说一句，如果没有它，将不会起作用）。为了它出现，您需要执行从指令中的两个步骤IdentityExperienceFramework在ProxyIdentityExperienceFramework，即
1.在“ 管理”部分中，选择“ API配置”。

2.选择添加作用域，然后选择保存并继续接受默认的应用程序标识符URI。

接下来，您需要下载存储库。

打开“ Identity Experience Framework”选项卡，并按以下顺序从根目录（场景除外）中的一个文件夹下载文件：
a.TrustFrameworkBase.xml
b.TrustFrameworkExtensions.xml
c.SignUpOrSignin。XML
d.ProfileEdit。XML
e.PasswordReset。XML格式

结论


完成工作后，您将获得准备好的服务，以方便您与用户一起工作。

感谢您的关注！

More articles:


All Articles