带有Azure AD B2C受众验证的Angular失败 [英] Angular with Azure AD B2C Audience Validation Failed

问题描述

我有Anuglar5 spa前端和ASP.NET Core API.两者均由Azure AD B2C服务保护.角度应用程序正确地重定向到登录页面，并且登录返回令牌.当我尝试使用令牌调用API时；

I have an Anuglar5 spa frontend and ASP.NET Core API. Both secured by Azure AD B2C service. The angular application redirects correctly to the login page and signing in returns a token. When I try to call the API with the token I get;

AuthenticationFailed:IDX10214:听众验证失败.受众群体:"627684f5-5011-475a-9cbd-55fcdcdf369e".不匹配:validationParameters.ValidAudience:'ee8b98a0-ae7a-38b2-9e73-d175df22ef4c'或validationParameters.ValidAudiences:'null'.

"627684f5-5011-475a-9cbd-55fcdcdf369e"是前端应用程序的应用程序ID.而"ee8b98a0-ae7a-38b2-9e73-d175df22ef4c"是该API的应用ID.

"627684f5-5011-475a-9cbd-55fcdcdf369e" is the Application ID of the frontend app. And "ee8b98a0-ae7a-38b2-9e73-d175df22ef4c" is the Application ID of the API.

我的代码；

`出口类MSALService {

`export class MSALService {

private applicationConfig: any = {
    clientID: '627684f5-5011-475a-9cbd-55fcdcdf369e',
    authority: 'https://login.microsoftonline.com/tfp/mytenant.onmicrosoft.com/B2C_1_my_signin_signup',
    b2cScopes: ['https://meeblitenant.onmicrosoft.com/api/myapp_read', 'https://meeblitenant.onmicrosoft.com/api/myapp_write'],
    redirectUrl: 'http://localhost:4200/'
};

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 }
    );
}

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);
                });
        }
    );
}

}`

使用Postman中返回的令牌也会返回相同的错误.我的理论是，我用来调用Azure AD B2C的URL是问题，但通过文档查看我找不到问题.

Using the token that is returned in Postman also returns the same error. My theory is that the URL I am using to call Azure AD B2C is the problem but looking through the docs I cannot find the problem.

任何帮助将不胜感激.

推荐答案

Kinda听起来就像您将ID令牌(而不是访问令牌)发送到API(用于前端)一样.您可以通过解码在 https://jwt.ms 处获得的令牌来进一步调试问题.

Kinda sounds like you are sending the Id token to the API (which is meant for your front-end) instead of an access token. You can debug the issue further by decoding the token you get at https://jwt.ms.

aud (听众)应该与您的API的ID相匹配，并且您要求的范围也应该在其中.

There the aud (audience) should match your API's id, and the scopes you asked should also be there.

这篇关于带有Azure AD B2C受众验证的Angular失败的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！