MSAL V1.x 如何动态更新客户端 ID 和权限（我使用的是 Angular 7）

Question

我正在使用 @azure/msal-angular 版本 ^1.1.2，我面临着如何动态更新 MsalModule 的问题 我指的是代码库 https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/msal-angular-v1/samples/msal-angular-samples/angular7-sample-app/src /app/app.module.ts

我有另一个 API，它在 API 调用后返回此配置，如何更新这些详细信息？ MsalModule.forRoot({})

@NgModule({
    declarations: [],
   imports: [  MsalModule.forRoot({ auth: {
            clientId: '',
            authority: '',
            redirectUri: '',
            postLogoutRedirectUri: '',
            navigateToLoginRequestUrl: true
        } },
            {
                popUp: !isIE,
                consentScopes: [
                    'profile',
                    'user.read',
                    'offline_access'
                ],
                unprotectedResources: ['https://www.microsoft.com'],
                protectedResourceMap,
                extraQueryParameters: {},
            })
            ]

由于 MSAL 1.x 不支持 .instance 方法（该方法在版本 2.x 中可用），因此我能够在版本 2.x 中动态更新配置（使用 msalService.instance），但不能在 1.x 中.x。您能指导我如何在 1.x 版本中动态更新配置吗？

Answer 1

经过大量的尝试和错误，我终于找到了动态更新MSAL 1.x配置的解决方案。这是代码：

import {MsalService } from '@azure/msal-angular';
import * as Msal from 'msal';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {

  private msalApp: Msal.UserAgentApplication;
  private defaultConfig: Msal.Configuration = {
    auth: {
      clientId: 'initial-client-id',  // Default clientId
      authority: 'https://login.microsoftonline.com/your-tenant-id',  // Default authority
    },
    cache: {
      cacheLocation: 'localStorage',
      storeAuthStateInCookie: false,
    },
  };

  constructor(private authService: MsalService) { }
      ngOnInit() {
      }


  loginAzure() {
    this.msalApp = null;
    const updatedConfig: Msal.Configuration = {
      auth: { // update dynamic data here
        clientId: config.clientId, // dynamic clientId
        authority: config.authority, // dynamic authority
        redirectUri: config.redirectUrl, // dynamic redirectUrl
        postLogoutRedirectUri: config.redirectUrl, // dynamic redirectUrl
        navigateToLoginRequestUrl: true
      },
      cache: this.defaultConfig.cache,
    };
    this.msalApp = new Msal.UserAgentApplication(updatedConfig);
    this.msalApp.loginPopup().then(response => {
      console.log('response', response)
    }).catch(error => {
      console.error(error);
    });
  }

}