angular-oauth2-oidc 忘记密码流程

Question

我正在使用 angular-oauth2-oidc 在我的 Angular (8) 应用程序上设置 B2C。我有登录和退出策略，并且我已经正确地设置了 angular-oauth2-oidc 服务。目前我正在使用包含忘记密码 link 的标准 Microsoft 登录页面。我已经在 B2C 中创建了忘记密码的流程，但我正在努力将其集成到 angular-oauth2-oidc 中。当我点击忘记密码 link 时，B2C 抛出错误 "AADB2C90118"；为了确保流程正确，我测试了创建 AuthConfig 文件的流程，例如我为登录策略创建的文件；仅使用忘记密码流程信息（在这种情况下，用户单击一个按钮并被重定向到忘记密码发布者）- 它有效。

AuthConfig 文件中是否有任何变量可以设置为忘记密码端点或可以处理此问题的任何方式？

Answer 1

我按照 angular-oauth2-oidc 库的创建者的建议设法让它工作。

首先，我创建了一个 OAuthErrorEventParams 接口，我可以将我的 OAuthErrorEvent.params 转换为：

export interface OAuthErrorEventParams {
   error: string;
   error_description: string;
   state: string;
 }

然后我创建了这个常量来表示我的 RedirectUrl 以重定向到密码重置流程：

export const PasswordResetUrl = 'https://[tenantname].b2clogin.com/[tenantname].onmicrosoft.com/oauth2/v2.0/authorize?' +
    'p=[PasswordResetFlowName]' +
    '&client_id=' + authConfig.clientId +
    '&nonce=defaultNonce' +
    '&redirect_uri=' + window.location.origin + '/index.html' +
    '&scope=openid' +
    '&response_type=id_token' +
    '&prompt=login';

然后最后在处理 Auth 服务的设置和配置的组件中，我添加了以下内容：

constructor(private oauthService: OAuthService) {
     this.configure();
     this.oauthService.events.subscribe(e => {
       if (e instanceof OAuthErrorEvent) {
         const parm = e.params as OAuthErrorEventParams;
         if (parm.error === 'access_denied' && parm.error_description.includes('AADB2C90118')) {
           // redirect to forgot password flow
           window.location.href = PasswordResetUrl;
         } else if (parm.error === 'access_denied' && parm.error_description.includes('AADB2C90091')) {
           // user has cancelled out of password reset
           this.oauthService.initLoginFlow();
         }
       }
     });
     this.oauthService.tryLoginImplicitFlow();
   }

我真的希望这对某人有所帮助，因为在登陆这里之前我花了很多时间找到解决方案。

Answer 2

对于代码流有此问题的人（NO IMPLICIT GRANT），我们必须像这样编辑 PasswordResetUrl：

export const PasswordResetUrl = 'https://[tenantname].b2clogin.com/[tenantname].onmicrosoft.com/oauth2/v2.0/authorize?' +
'p=[PasswordResetFlowName]' +
'&client_id=' + authConfig.clientId +
'&nonce=defaultNonce' +
'&redirect_uri=' + window.location.origin + '/index.html' +
'&scope=openid' +
'&response_type=code' +
'&prompt=login' +
'&code_challenge=##################&code_challenge_method=S256';

angular-oauth2-oidc 忘记密码流程

angular-oauth2-oidc forgot password flow

angular

azure-ad-b2c

angular-oauth2-oidc