msal.js 2.0 tokenResponse 在 loginRedirect 后为空

Question

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

但是，在我登录后，tokenResponse 返回为 null。我试过改变权限和范围，但它总是返回为空。如何获得 handleRedirectPromise 到 return 有效的令牌响应？

这是我的代码：

    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.

Answer 1

您设置重定向流程的方式似乎是正确的。您首先必须调用 handleRedirectPromise()（注册它），然后调用 loginRedirect()。在页面加载时 handleRedirectPromise() 将 return null，在 sign-in 之后它应该 return 令牌。

但是您的配置存在问题。

您需要将您的域指定为 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'
        },

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

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

Answer 2

问题出在我的 angular 应用上。我让我的应用程序将基础 url 重定向到我的 /home 路线。因此，无论何时您打开基本路线，应用程序都会被重定向。从这条路线发出请求。我将 /home 路由的重定向 uri 添加到我的 AAD 应用程序注册中，在我的 b2c 配置中注释掉了 redirectUri，并将 navigateToLoginRequestUrl 设置为 true。

msal.js 2.0 tokenResponse 在 loginRedirect 后为空

msal.js 2.0 tokenResponse null after loginRedirect

azure-ad-b2c

msal

msal.js