可以使用Msal/angular插件中的loginRedirect()方法来解决这个问题。这将导致用户在新窗口或标签页中打开身份验证页面,以避免在当前应用程序中打开身份验证页面导致应用程序状态丢失。
代码示例:
import { Component } from '@angular/core';
import * as Msal from 'msal';
const config = {
auth: {
clientId: '',
authority: ''
},
cache: {
cacheLocation: 'localStorage', // This configures where your cache will be stored
storeAuthStateInCookie: true, // Set this to true if you are having issues on IE11 or Edge
}
};
const loginRequest = {
scopes: [ '' ]
};
const myMsal = new Msal.UserAgentApplication(config);
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
ngOnInit() {
myMsal.handleRedirectCallback((error, response) => {
if (error) {
console.error(error);
return;
}
console.log(response);
});
myMsal.loginRedirect(loginRequest);
}
logout() {
myMsal.logout();
}
getToken() {
myMsal.acquireTokenSilent(loginRequest).then(token => console.log(token));
}
}
在此示例中,loginRedirect()方法用于在新的窗口或标签页中打开身份验证页面。该方法将重新定向到/signin-oidcURL,并设置msal.NONCE_IDTOKENcookie,以便在完成身份验证后验证正确性。