Errores en MSAL Angular

BrowserAuthErrors

Interacción_en_curso

Mensaje de error: La interacción está actualmente en curso. Asegúrese de que esta interacción se ha completado antes de llamar a una API interactiva.

Este error se produce cuando se invoca una API interactiva (loginPopup, loginRedirect, acquireTokenPopup, acquireTokenRedirect) mientras que otra API interactiva sigue en curso. Las API de inicio de sesión y acquireToken son asíncronas, por lo que deberá asegurarse de que las promesas resultantes se resuelvan antes de invocar otra API.

En @azure/msal-angular hay dos escenarios comunes cuando esto puede ocurrir:

1. La aplicación no controla los redireccionamientos correctamente. El error se produce cuando la aplicación o el usuario intentan llamar a una API interactiva.
2. La aplicación llama a una de las API anteriores sin comprobar primero si la interacción ya está en curso en otro lugar.

Los redireccionamientos deben controlarse con MsalRedirectComponent o con la llamada a handleRedirectObservable(). No controlar los redireccionamientos explícitamente con cualquiera de estos dos enfoques producirá el error anterior. Consulte nuestros documentos sobre redirecciones aquí para obtener más información sobre ambos enfoques.

Además, cualquier interacción debe realizarse después de suscribirse al observable inProgress$ y de filtrar por InteractionStatus.None. No se admite el intento de interacción mientras hay otro en curso y se producirá el error anterior. Comprobar si existe InteractionStatus.None es la forma de asegurarse de que esto no suceda. Consulte nuestro documento de eventos para obtener más detalles.

Consulte el @azure/msal-browser documento de error para obtener más información sobre este error.

❌ En el ejemplo siguiente se producirá este error cuando otro componente ya haya invocado una API interactiva que esté en curso:

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();
  }

✔️ Para corregir el ejemplo anterior, compruebe que ninguna otra interacción esté en curso antes de invocar 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();
      })
  }

Pasos para solucionar problemas

• Habilite el registro detallado y realice un seguimiento del orden de los eventos. Compruebe que una API interactiva no se invoca antes de que se haya resuelto otra.
• Si utiliza el flujo de redirección, asegúrese de que MsalRedirectComponet se inicializa correctamente o de que se llama a handleRedirectObservable en cada página a la que pueda redirigirse.

Si no puede averiguar por qué se produce este error, abra un problema y prepárese para compartir la siguiente información:

• Registros detallados
• Una aplicación de ejemplo o fragmentos de código que podemos usar para reproducir el problema
• Actualice la página. ¿El error desaparece?
• Abra la aplicación en una pestaña nueva. ¿El error desaparece?