Мне приходится обрабатывать несколько страниц / приложений входа в систему, которые должны перенаправляться на общую целевую страницу index. html и мне нужно получить доступ к настраиваемой строке для идентификации запрошенного приложения. Конечная точка генерации токена является общей для всех страниц входа.
Сценарий:
У меня несколько страниц входа
1: Login1. html
2: Login2. html
Конечная точка генерации токена будет одинаковой для обеих страниц входа в систему.
После успешной аутентификации из приложения Azure AD B2 C оно будет перенаправлено на общую целевую страницу 'http://localhost: 6420' . (Это значение, которое я установил в качестве URL-адреса перенаправления на портале приложений azure ad b2 c).
Мне нужно передать настраиваемую строку, для которой мне нужно идентифицировать из какого пользовательского интерфейса пользователь в настоящее время вошел в систему. т.е. для вторичной проверки, если пользователь вошел в систему со страницы login1. html, мне нужно передать 'log1' из login1. html и получить доступ к этому значению на моей общей целевой странице.
Я пробовал использовать как 'state', так и 'extraQueryParameters', но не уверен, как они работают в соответствии с моими требованиями.
const loginRequest = {
scopes: ["openid", "profile"],
extraQueryParameters: { campaignId: 'hawaii', ui_locales: 'es' }
};
Любая помощь будет высоко ценится. Заранее спасибо.
- app-config.ts
import { Configuration } from 'msal';
import { MsalAngularConfiguration } from '@azure/msal-angular';
// this checks if the app is running on IE
export const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;
export const b2cPolicies = {
names: {
signUpSignIn: "b2c_1_susi",
resetPassword: "b2c_1_reset",
},
authorities: {
signUpSignIn: {
authority: "https://fabrikamb2c.b2clogin.com/fabrikamb2c.onmicrosoft.com/b2c_1_susi"
},
resetPassword: {
authority: "https://fabrikamb2c.b2clogin.com/fabrikamb2c.onmicrosoft.com/b2c_1_reset"
}
}
}
export const apiConfig: {b2cScopes: string[], webApi: string} = {
b2cScopes: ['https://fabrikamb2c.onmicrosoft.com/helloapi/demo.read'],
webApi: 'https://fabrikamb2chello.azurewebsites.net/hello'
};
export const msalConfig: Configuration = {
auth: {
clientId: "e760cab2-b9a1-4c0d-86fb-ff7084abd902",
authority: b2cPolicies.authorities.signUpSignIn.authority,
redirectUri: "http://localhost:6420/",
postLogoutRedirectUri: "http://localhost:6420/",
navigateToLoginRequestUrl: true,
validateAuthority: false,
},
cache: {
cacheLocation: "localStorage",
storeAuthStateInCookie: isIE, // Set this to "true" to save cache in cookies to address trusted zones limitations in IE
},
}
export const loginRequest = {
scopes: ['openid', 'profile'],
extraQueryParameters: { userPage: 'Page1', ui_locales: 'es' }
};
// Scopes you enter will be used for the access token request for your web API
export const tokenRequest: {scopes: string[]} = {
scopes: apiConfig.b2cScopes // i.e. [https://fabrikamb2c.onmicrosoft.com/helloapi/demo.read]
};
export const protectedResourceMap: [string, string[]][] = [
[apiConfig.webApi, apiConfig.b2cScopes] // i.e. [https://fabrikamb2chello.azurewebsites.net/hello, ['https://fabrikamb2c.onmicrosoft.com/helloapi/demo.read']]
];
export const msalAngularConfig: MsalAngularConfiguration = {
popUp: !isIE,
consentScopes: [
...loginRequest.scopes,
...tokenRequest.scopes,
],
unprotectedResources: [], // API calls to these coordinates will NOT activate MSALGuard
protectedResourceMap, // API calls to these coordinates will activate MSALGuard
extraQueryParameters: { campaignId: 'hawaii', ui_locales: 'es' }
}
- app.component.ts
import { Component, OnInit } from '@angular/core';
import { BroadcastService, MsalService} from '@azure/msal-angular';
import { Logger, CryptoUtils } from 'msal';
import { isIE, b2cPolicies } from './app-config';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
title = 'Azure AD B2C';
isIframe = false;
loggedIn = false;
constructor(private broadcastService: BroadcastService, private authService: MsalService) { }
ngOnInit() {
this.isIframe = window !== window.parent && !window.opener;
this.checkAccount();
// event listeners for authentication status
this.broadcastService.subscribe('msal:loginSuccess', (success) => {
// We need to reject id tokens that were not issued with the default sign-in policy.
// "acr" claim in the token tells us what policy is used (NOTE: for new policies (v2.0), use "tfp" instead of "acr")
// To learn more about b2c tokens, visit https://docs.microsoft.com/en-us/azure/active-directory-b2c/tokens-overview
if (success.idToken.claims['acr'] !== b2cPolicies.names.signUpSignIn) {
window.alert("Password has been reset successfully. \nPlease sign-in with your new password");
return this.authService.logout()
}
console.log('login succeeded. id token acquired at: ' + new Date().toString());
console.log(success);
this.checkAccount();
});
this.broadcastService.subscribe('msal:loginFailure', (error) => {
console.log('login failed');
console.log(error);
// Check for forgot password error
// Learn more about AAD error codes at https://docs.microsoft.com/en-us/azure/active-directory/develop/reference-aadsts-error-codes
if (error.errorMessage.indexOf('AADB2C90118') > -1) {
if (isIE) {
this.authService.loginRedirect(b2cPolicies.authorities.resetPassword);
} else {
this.authService.loginPopup(b2cPolicies.authorities.resetPassword);
}
}
});
// redirect callback for redirect flow (IE)
this.authService.handleRedirectCallback((authError, response) => {
if (authError) {
console.error('Redirect Error: ', authError.errorMessage);
return;
}
console.log('Redirect Success: ', response);
});
this.authService.setLogger(new Logger((logLevel, message, piiEnabled) => {
console.log('MSAL Logging: ', message);
}, {
correlationId: CryptoUtils.createNewGuid(),
piiLoggingEnabled: false
}));
}
// other methods
checkAccount() {
this.loggedIn = !!this.authService.getAccount();
}
login() {
if (isIE) {
this.authService.loginRedirect();
} else {
this.authService.loginPopup();
}
}
logout() {
this.authService.logout();
}
}