Errori in MSAL Angular

BrowserAuthErrors

Interazione_in_corso

Messaggio di errore: l'interazione è attualmente in corso. Assicurarsi che questa interazione sia stata completata prima di chiamare un'API interattiva.

Questo errore viene generato quando viene richiamata un'API interattiva (loginPopup, loginRedirect, acquireTokenPopup, acquireTokenRedirect) mentre è ancora in corso un'altra API interattiva. Le API login e acquireToken sono asincrone, quindi è necessario assicurarsi che le promesse risultanti siano state risolte prima di richiamarne un'altra.

In @azure/msal-angular esistono 2 scenari comuni quando ciò può verificarsi:

  1. L'applicazione non gestisce correttamente i reindirizzamenti. L'errore si verifica quindi quando l'app o l'utente tenta di chiamare un'API interattiva.
  2. L'applicazione chiama una delle API precedenti senza prima controllare se l'interazione è già in corso altrove.

I reindirizzamenti devono essere gestiti tramite MsalRedirectComponent oppure tramite una chiamata a handleRedirectObservable(). La mancata gestione dei reindirizzamenti in modo esplicito con uno di questi due approcci comporterà l'errore precedente. Per altre informazioni su entrambi gli approcci, vedere la documentazione sui reindirizzamenti qui .

Inoltre, qualsiasi interazione deve avvenire dopo la sottoscrizione all'osservabile inProgress$ e dopo aver filtrato per InteractionStatus.None. Il tentativo di interazione mentre un altro è in corso non è supportato e genererà l'errore precedente. Verificare la presenza di InteractionStatus.None è il modo per assicurarsi che ciò non accada. Per altri dettagli, vedere la documentazione degli eventi .

Per altre informazioni su questo errore, vedere il @azure/msal-browser documento degli errori .

❌ L'esempio seguente genererà questo errore quando un altro componente ha già richiamato un'API interattiva in corso:

import { Component, OnInit } from '@angular/core';
import { MsalService, MsalBroadcastService, InteractionStatus } from '@azure/msal-angular';
import { filter } from 'rxjs/operators';

@Component()
export class ExampleComponent implements OnInit {

  constructor(
    private msalBroadcastService: MsalBroadcastService,
    private authService: MsalService
  ) {}

  ngOnInit(): void {
    this.authService.loginRedirect();
  }

✔️ Per correggere l'esempio precedente, verificare che nessun'altra interazione sia in corso prima di richiamare loginRedirect:

import { Component, OnInit } from '@angular/core';
import { InteractionStatus } from '@azure/msal-browser';
import { MsalService, MsalBroadcastService } from '@azure/msal-angular';
import { filter } from 'rxjs/operators';

@Component()
export class ExampleComponent implements OnInit {

  constructor(
    private msalBroadcastService: MsalBroadcastService,
    private authService: MsalService
  ) {}

  ngOnInit(): void {
    this.msalBroadcastService.inProgress$
      .pipe(
        filter((status: InteractionStatus) => status === InteractionStatus.None),
      )
      .subscribe(() => {
        this.authService.loginRedirect();
      })
  }

Passaggi per la risoluzione dei problemi

  • Abilitare la registrazione dettagliata e tracciare l'ordine degli eventi. Verificare che un'API interattiva non venga richiamata prima che venga risolta un'altra API interattiva.
  • Se si utilizza il flusso di reindirizzamento, assicurarsi che MsalRedirectComponet sia inizializzato correttamente o che handleRedirectObservable venga chiamato in ogni pagina alla quale potrebbe essere reindirizzata.

Se non si riesce a capire perché questo errore viene generato, aprire un problema e prepararsi a condividere le informazioni seguenti:

  • Log dettagliati
  • Un'app di esempio e/o frammenti di codice che è possibile usare per riprodurre il problema
  • Aggiornare la pagina. L'errore viene eliminato?
  • Aprire l'applicazione in una nuova scheda. L'errore viene eliminato?