Fouten in MSAL Angular

BrowserAuthErrors

Interaction_in_progress

Foutbericht: De interactie wordt momenteel uitgevoerd. Zorg ervoor dat deze interactie is voltooid voordat u een interactieve API aanroept.

Deze fout treedt op wanneer een interactieve API (loginPopup, loginRedirect, acquireTokenPopup, ) acquireTokenRedirectwordt aangeroepen terwijl er nog een interactieve API wordt uitgevoerd. De aanmeldings- en acquireToken-API's zijn asynchroon, dus u moet ervoor zorgen dat de resulterende beloften zijn opgelost voordat u een andere aanroept.

Er @azure/msal-angular zijn twee veelvoorkomende scenario's waarin dit kan gebeuren:

  1. Uw toepassing verwerkt omleidingen niet correct. De fout treedt vervolgens op wanneer de app of de gebruiker probeert een interactieve API aan te roepen.
  2. Uw toepassing roept een van de bovenstaande API's aan zonder eerst te controleren of er ergens anders al interactie wordt uitgevoerd.

Omleidingen moeten worden afgehandeld, hetzij via MsalRedirectComponent, hetzij door handleRedirectObservable() aan te roepen. Het niet expliciet verwerken van omleidingen met een van deze twee benaderingen leidt tot de bovenstaande fout. Zie onze documenten over omleidingen hier voor meer informatie over beide benaderingen.

Daarnaast moeten alle interacties worden uitgevoerd nadat u zich hebt geabonneerd op de inProgress$ observable en hebt gefilterd op InteractionStatus.None. Het uitvoeren van interactie terwijl een andere wordt uitgevoerd, wordt niet ondersteund en resulteert in de bovenstaande fout. Controleren op InteractionStatus.None is hoe u ervoor zorgt dat dit niet gebeurt. Raadpleeg onze documentatie voor evenementen voor meer informatie.

Raadpleeg het @azure/msal-browser foutendocumenten voor meer informatie over deze fout.

❌ In het volgende voorbeeld wordt deze fout gegenereerd wanneer een ander onderdeel al een interactieve API heeft aangeroepen die wordt uitgevoerd:

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

✔️ Als u het vorige voorbeeld wilt oplossen, controleert u of er geen andere interactie wordt uitgevoerd voordat u het volgende aanroept 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();
      })
  }

Stappen voor probleemoplossing

  • Schakel uitgebreide logboekregistratie in en traceer de volgorde van gebeurtenissen. Controleer of een interactieve API niet wordt aangeroepen voordat een andere api is opgelost.
  • Als u de redirectstroom gebruikt, zorg er dan voor dat MsalRedirectComponet correct wordt geïnitialiseerd of dat handleRedirectObservable wordt aangeroepen op elke pagina waarnaar mogelijk wordt omgeleid.

Als u niet kunt achterhalen waarom deze fout wordt weergegeven, maak dan een issue aan en zorg dat u de volgende informatie kunt delen:

  • Gedetailleerde logboeken
  • Een voorbeeld-app en/of codefragmenten die we kunnen gebruiken om het probleem te reproduceren
  • Vernieuw de pagina. Gaat de fout weg?
  • Open uw toepassing op een nieuw tabblad. Gaat de fout weg?