1

我正在为使用 Azure AD B2C 和自定义登录屏幕的工作设置无服务器 Angular 7 应用程序。这个应用程序的目标是允许用户在我们的应用程序内通过 B2C 登录,然后根据角色将他们路由到应用程序内的其他页面。我能够成功登录并被重定向到 /index.html(正确的行为),但索引页面不断重新加载新的状态和令牌值,从而防止由于刷新而点击网页上的任何内容。关于如何阻止这种令人耳目一新的任何想法?

我尝试设置登录选项,使用发现文档,检查有效令牌。我已经更改了我的重定向 uri,并多次实施/未实施我自己的路由。我也研究了 websocket-dev-server 重新加载问题,但我不相信这就是我的错误所在。老实说,我在这里和 github 上尝试了几乎所有与此问题相关的选项。

在发现文档中使用任何内容都会导致关于 /.well-known/openid-configuration 的 404 not found 消息。我尝试过的其他选项并没有改变结果。

我正在使用隐式流程。我安装了签名证书。在 localhost 上运行和在 Azure 端点上运行时,结果是相同的。我目前没有为 root 使用任何路由路径(与我使用时的结果相同)。

app.component.ts

constructor(private oauthService: OAuthService) {
    this.configureWithNewApiConfig();
}

private configureWithNewApiConfig() {  
    this.configureAuth();
    this.oauthService.setStorage(sessionStorage);
    this.oauthService.tokenValidationHandler = new JwksValidationHandler();
    this.oauthService.initImplicitFlow();
 }

private configureAuth(): void {
this.oauthService.configure( {
      clientId: '9c3276bb-22c3-429f-a456-fcfcef3254d0',
      redirectUri: 'https://<url>storagedev.z13.web.core.windows.net/index.html',
      loginUrl: 'https://<url>.b2clogin.com/<url>.onmicrosoft.com/oauth2/v2.0/authorize?p=b2c_1_localaccount_signin',
      logoutUrl: 'https://<url>.b2clogin.com/<url>.onmicrosoft.com/oauth2/v2.0/logout?p=b2c_1_localaccount_signin',
      scope: 'openid https://<url>.onmicrosoft.com/<api-name>/user_impersonation',
      oidc: true,
      issuer: 'https://<url>.b2clogin.com/ab735adf-d58c-4607-b749-2c78ab372df4/v2.0/',
      tokenEndpoint: 'https://<url>.b2clogin.com/<url>.onmicrosoft.com/oauth2/v2.0/token?p=b2c_1_localaccount_signin',
      responseType: 'id_token token',
      clearHashAfterLogin: true,
      disableAtHashCheck: true,
      showDebugInformation: true,
      strictDiscoveryDocumentValidation: false, 
      jwks: {
        keys: [
          {
            "kid":"X5eXk4xyojNFum1kl2Ytv8dlNP4-c57dO6QGTVBwaNk",
            "nbf":1493763266,
            "use":"sig",
            "kty":"RSA",
            "e":"AQAB",
            "n":"tVKUtcx_n9rt5afY_2WFNvU6PlFMggCatsZ3l4RjKxH0jgdLq6CScb0P3ZGXYbPzXvmmLiWZizpb-h0qup5jznOvOr-Dhw9908584BSgC83YacjWNqEK3urxhyE2jWjwRm2N95WGgb5mzE5XmZIvkvyXnn7X8dvgFPF5QwIngGsDG8LyHuJWlaDhr_EPLMW4wHvH0zZCuRMARIJmmqiMy3VD4ftq4nS5s8vJL0pVSrkuNojtokp84AtkADCDU_BUhrc2sIgfnvZ03koCQRoZmWiHu86SuJZYkDFstVTVSR0hiXudFlfQ2rOhPlpObmku68lXw-7V-P7jwrQRFfQVXw"
          }
        ]
      },     
    });
  }

预期的结果是,一旦登录,用户应该能够留在索引页面上而无需重新加载循环。

Fiddler 没有显示任何错误,在 Chrome 中查看控制台只会显示页面已导航到的次数的迭代。Firefox、Chrome 和 IE 的结果相同。

这完全有可能与我忽略的无关。这是我必须制作的第一个这种大小的 Angular 应用程序。

4

1 回答 1

0

不断重新加载是由于尝试在构造函数或 ngOnInit 方法中立即加载自定义 B2C 登录屏幕而引起的。虽然在任何其他操作发生之前先加载登录屏幕对我们来说是理想的,但我们会先让用户在登录之前进入登录页面,直到可以进行进一步的开发来解决这个问题。

于 2019-04-09T15:17:47.367 回答