首页 > 解决方案 > 用于用户身份验证的 Azure AD B2C REST API 端点

问题描述

我正在尝试通过 Azure AD B2C 服务对基于 Reactjs 的应用程序的用户进行身份验证。在浏览文档时,我发现了 2 种方法 - 弹出和重定向,但是这两个选项都有一些限制,比如我希望登录/注册表单非常自定义,或者我希望在新用户注册时返回回调等。另外,我我正在使用 AD 对 React Native 移动应用程序的用户进行身份验证,并且我必须使用 webview 进行重定向,这不会给人一种非常原生的感觉。

一些论坛给出的这些限制的解决方案是使用 API 连接器,但我再次无法找到一些好的文档。

任何人都可以使用我可以创建的自定义表单来帮助确定用户身份验证和注册的好方法,也许可以通过纯粹在前端使用一些 API 端点或任何 SDK 来实现?

标签: javascriptreactjsazureazure-ad-b2cmsal

解决方案


• 一个好的方法是通过在应用注册中注册您的 React js 应用程序,在 Azure AD B2C 中创建用于登录/注册和身份验证的用户流。注册应用程序后,为该应用程序配置 API 访问标签和注册/登录用户流程。完成后,创建一个名为 B2C.js 的文件并添加以下代码以在其中添加“msal”身份验证库,以便为部署的 react js 应用程序提供身份验证。

   ‘ var msalAppConfig = {
       auth: {
       clientId: '<client Id>',
     authority:'https://<TenantSubDomain>.b2clogin.com/<Tenant>/<signInPolicy>',
       redirectUri: '<Redirect Url>',
      validateAuthority: false,
       postLogoutRedirectUri: 'window.location.origin'},
          cache: {
        cacheLocation: 'sessionStorage',
         storeAuthStateInCookie: isIE()
       } ‘

• 替换“client id”、“redirect url”和其他“<>”值,这些值可以通过在 azure ad b2c 应用程序注册字段中创建的应用程序填充。完成后,登录/注册页面将如下所示:-

Azure AD B2C 用户流

• 确保正确编辑index.js 和b2c.js 文件将需要详细信息,以便通过azure ad b2c 正确进行身份验证。

请找到以下链接以获取有关添加身份验证和上述注册/登录页面的更多信息:-

https://blog.devgenius.io/secure-login-in-reactjs-with-azure-ad-b2c-fc0f919db1dc


推荐阅读