如何在 Azure B2C 上的同一个 HTML 文件中呈现两个自定义策略?

How to render two custom policies within the same HTML file on Azure B2C?

是否有可能实现目标场景?

<!DOCTYPE html>
<html>
<head>
    <title>My Product Brand Name</title>
</head>
<body>
    <!-- api.localaccountsignup section -->
    <div id="api1"></div>
    <!-- api.signuporsignin -->
    <div id="api2"></div>
</body>
</html>

理想情况下,我有一个托管本地帐户注册和注册或签名的前端,如下图

创建 2 个策略。

  1. 注册政策。它将使用 B2C 呈现“全名”、“电子邮件”和“密码”字段。使用自定义 HTML 添加 3 个按钮“Google”、“Facebook”、“LinkedIn”。每个按钮将 link 到您的应用程序:myapp.com/<social_provider_name>。当用户点击这些 link 之一时,应用程序应将用户发送到带有相应 domain_hint 参数的第二个策略。

  2. 此策略将配置“Google”、“Facebook”、“LinkedIn”IdP。每个都将配置为 direct sign in。该应用程序将根据策略 1 中的用户操作传递参数 domain_hint,然后使用户点击他们选择的社交 IdP。

使用 MSAL 添加参数: https://docs.microsoft.com/en-us/azure/active-directory-b2c/enable-authentication-spa-app-options#pass-a-custom-query-string-parameter