msal.js 2.0 tokenResponse null登录后重定向

如何解决msal.js 2.0 tokenResponse null登录后重定向

我正在开发一个利用Azure B2C进行策略和用户管理的Angular 10应用程序。我在Azure Active Directory中将应用程序注册设置为单页应用程序，而未选中隐式选项。我正在使用msal.js 2.0 @azure/msal-browser登录到B2C，并使用代码流检索ID和访问令牌。我设置了配置，创建了msal对象，定义了重定向承诺，然后在以后使用适当的用户范围调用loginRedirect。页面正确重定向。

但是，在我登录tokenResponse之后，它以null返回。我曾尝试更改权限和范围，但始终会返回null。如何获得handleRedirectPromise返回有效的令牌响应？

这是我的代码：

    private msalConfig: Msal.Configuration = {
        auth: {
            clientId: xxxx-xx-xx-xx-xxxxx,authority: 'https://login.microsoftonline.com/common',redirectUri: 'https://localhost:4200'
        },cache: {
            cacheLocation: 'sessionStorage',storeAuthStateInCookie: false
        },};

    private loginRequest: Msal.RedirectRequest = {
        scopes: ['user.read'],};

    const msalInstance = new Msal.PublicClientApplication(this.msalConfig);
    msalInstance
            .handleRedirectPromise()
            .then((tokenResponse: Msal.AuthenticationResult) => {
                let accountObj = null;
                if (tokenResponse !== null) {
                    accountObj = tokenResponse.account;
                    const id_token = tokenResponse.idToken;
                    const access_token = tokenResponse.accessToken;
                    console.log('id_token',id_token);
                    console.log('access_token',access_token);
                }
            })
            .catch(error => {
                authStore.loginError$.next(true);
                console.error(error);
            });

    msalInstance.loginRedirect(this.loginRequest);

编辑：

我还尝试了authority: `https://<tenant-name>.b2clogin.com/<tenant-name>.onmicrosoft.com/<policy-name>对象中的https://login.microsoftonline.com/tfp/{tenant}.onmicrosoft.com/B2C_1_SiupIn和msalConfig以及scopes: ['openid']中的loginRequest的权限。尝试登录时，在浏览器中出现以下错误：

zone-evergreen.js:1068 GET https://login.microsoftonline.com/common/discovery/instance?api-version=1.1&authorization_endpoint=https://<tenant>.b2clogin.com/<tenant>.onmicrosoft.com/b2c_1_defaultsigninsignup/oauth2/v2.0/authorize 400 (Bad Request)

core.js:4197 ERROR Error: Uncaught (in promise): ClientAuthError: endpoints_resolution_error: Error: could not resolve endpoints. Please check network and try again. Detail: ClientConfigurationError: untrusted_authority: The provided authority is not a trusted authority. Please include this authority in the knownAuthorities config parameter.
ClientAuthError: endpoints_resolution_error: Error: could not resolve endpoints. Please check network and try again. Detail: ClientConfigurationError: untrusted_authority: The provided authority is not a trusted authority. Please include this authority in the knownAuthorities config parameter.

解决方法

设置重定向流程的方式似乎正确。首先，您必须调用handleRedirectPromise()（将其注册），然后调用loginRedirect()。在页面加载时，handleRedirectPromise()将返回null，登录后应返回令牌。

但是，您的配置存在问题。

1. 您需要将域指定为knownAuthority，例如：

        auth: {
            clientId: 'xxxx-xx-xx-xx-xxxxx',authority: 'https://<tenant-name>.b2clogin.com/<tenant-name>.onmicrosoft.com/<policy-name>',knownAuthorities: ['<your-tenant-name>.b2clogin.com']
            redirectUri: 'https://localhost:4200'
        },

1. User.Read是MS Graph API范围。您不能将其与B2C一起使用。仅允许 OIDC 范围，即改为使用openid。

有关更多信息，请参见this。

,

问题出在我的角度应用程序上。我的应用将基本网址重定向到了/ home路由。因此，每当您打开基本路线时，应用都会被重定向。从这条路线发出请求。我将/ home路由的重定向uri添加到了我的AAD应用程序注册中，在我的b2c配置中注释掉了redirectUri，并将navigationToLoginRequestUrl设置为true。