angular - 登录应用程序后,带有 MSAL 和 Angular 的 Azure AD B2C 会立即重定向到登录页面

标签 angular azure-ad-b2c msal

我有一个使用 ASP.NET 核心 Web API 的 Angular 应用程序。我使用 ADAL 进行身份验证,但现在客户也应该可以访问该应用程序,因此我删除了 ADAL 代码并添加了 MSAL 相关代码。我创建了一个 Azure AD B2C 租户并在应用程序中使用了这些凭据。当我现在运行应用程序时,我被重定向到完美的 Microsoft 登录页面。但是当我在输入电子邮件和密码后登录时,它会登录到应用程序并立即将我重定向到登录页面。我什至没有时间在开发工具中调试问题。 msal.service.ts 文件中的代码如下

private applicationConfig: any = {
    clientID: 'XXXXXXXXXXXXXXXXXXXXXXXXXXX',
    authority: 'XXXXXXXXXXXXXXXXXXXXXXXXXX',
    b2cScopes: ['XXXXXXXXXXXXXXXXXXXXXXXXX'],
    redirectUrl: 'XXXXXXXXXXXXXXXXXXXXXXXX'
};

private app: any;
public user: any;
constructor() {
    this.app = new UserAgentApplication(this.applicationConfig.clientID, this.applicationConfig.authority,
        (errorDesc, token, error, tokenType) => {
           console.log(token);
        }, { redirectUri: this.applicationConfig.redirectUrl });
    // this.app.redirectUri=this.applicationConfig.redirectUrl;
}

public login() {
    let tokenData = '';
    this.app.loginRedirect(this.applicationConfig.b2cScopes).then(data => {tokenData = data; });
}

public getUser() {
    const user = this.app.getUser();
    if (user) {
        return user;
    } else {
        return null;
    }
}

public logout() {
    this.app.logout();
}

public getToken() {
    return this.app.acquireTokenSilent(this.applicationConfig.b2cScopes)
        .then(accessToken => {
            console.log(accessToken);
            return accessToken;
        }, error => {
            return this.app.acquireTokenPopup(this.applicationConfig.b2cScopes)
                .then(accessToken => {
                    return accessToken;
                }, err => {
                    console.error(err);
                });
        });
}

auth.service.ts中的代码如下所示

constructor(private msalService: MSALService, public jwtHelper: JwtHelper) { }

public getToken(): string {
    const token: string = window.sessionStorage.getItem('msal.idtoken');
    return token;
}

public login() {
    const token = this.getToken();
    if (token == null || token === undefined || token === 'null') {
        this.msalService.login();
    }
}

public getTokenDecoded(): any
{
  return this.jwtHelper.decodeToken(this.getToken());
}

我在这上面花了很多时间,但无法确定问题的确切原因。请帮我解决这个问题

最佳答案

要调试这些问题,请在控制台和网络选项卡中打开保留日志:

console window screenshot

network tab screenshot


URL 中可能返回了一个错误,该错误应该在网络选项卡中可见。

例如:

https://jwt.ms/#error=server_error&error_description=AADB2C90161%3a+A+self-asserted+send+response+has+failed+with+reason+%27Internal+Server+Error%27.%0d%0aCorrelation+ID%3a+bc145550-912a-4f35-b833-334cf1ace96d%0d%0aTimestamp%3a+2018-01-08+01%3a48%3a43Z%0d%0a

关于angular - 登录应用程序后,带有 MSAL 和 Angular 的 Azure AD B2C 会立即重定向到登录页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48220994/

相关文章:

angular - 垫 slider : not updating immediately on drag

java - 如何向所有人开放端点?

从 native 应用程序登录 Azure AD B2C - 要登录此应用程序,必须将帐户添加到目录中

javascript - 如何使用 AAD B2C token 存储用户上下文

azure - 我可以在 ADB2C 中创建多少个用户?

unity3d - 在 Unity3D 中使用 MSAL .NET 库时不显示窗口提示

angular - Typescript 数组重组

html - Angular 2 Azure 媒体服务视频播放

cypress - MSAL 和 OAuth 2.0 - 以编程方式请求授权代码

azure-active-directory - Microsoft Android 应用程序未将签名哈希与应用程序回复 URI 匹配