Вход в MSAL с управлением состоянием NGRX

Question

Я использую вход MSAL, который автоматически перенаправляет на страницу входа в Microsoft, но когда я устанавливаю для местоположения кэша значение «нет» вместо «localStorage», оно не перенаправляется.

Я не хочу хранить токен в локальном хранилище. Как я могу это исправить и использовать NGRX для хранения токена? Пожалуйста, помогите.

        || window.navigator.userAgent.indexOf('Trident/') > -1;
  
export const protectedResourceMap: any = [
  [environment.baseURL, environment.scopedUri],
];

@NgModule({
  imports: [
    MsalModule.forRoot(new PublicClientApplication
      (
        {
          auth:{
            clientId:environment.uiClientId,
            redirectUri:environment.redirectUri,
            authority:'https://login.microsoftonline.com/'+ environment.tenantId
          },
          cache:
          {
            cacheLocation:'localStorage',
            storeAuthStateInCookie:isIE
          }
        }
      ),
      {
        interactionType:InteractionType.Redirect,
        authRequest:{
          scopes:['user.read']
        }
      },
      {
        interactionType:InteractionType.Redirect,
        protectedResourceMap:new Map(
          [
            ['https://graph.microsoft.com/v1.0/me',['user.Read']],
            ['localhost',[environment.apiScope]]
          ]
        )
      }
    )
  ],
  providers: [
      { provide: HTTP_INTERCEPTORS, useClass: MsalInterceptor, multi: true },
  ],
  bootstrap: [
    AppComponent
    , MsalRedirectComponent
  ]
})
export class AppModule { }```

Need to implement NGRX 

Answer 1

Согласно документации вы можете хранить токены только вlocalStorageилиsessionStorage.

Кстати, вам не нужно обрабатывать этот токен вMSAL. Вам необходимо прослушать локальное хранилище в эффектах NGRX для этого конкретного токена, а затем поместить его в хранилище NGRX с помощью действия.

Эффект NGRX будет аналогичен следующему:

       listenToMsalKey$ = createEffect(() =>
    fromEvent<StorageEvent>(window, 'storage').pipe(
      ofType<StorageEvent>('storage'),
      map((event: StorageEvent) => {
        if (event.key === 'msalToken') {
          // Dispatch an action with the new value
          return { type: '[Msal Storage] Token Changed', payload: event.newValue };
        }
      })
    )
  );

а затем вы сможете получить доступ к своему токену с помощью селектора в других частях вашего приложения.