Freigeben über


Single-Page-Webanwendung: Abrufen eines Tokens zum Aufrufen einer API

Das Muster für das Abrufen von Token für APIs mit MSAL.js besteht darin, zuerst zu versuchen, eine automatische Tokenanforderung mithilfe der acquireTokenSilent-Methode zu senden. Wenn diese Methode aufgerufen wird, überprüft die Bibliothek zuerst den Cache im Browserspeicher, um festzustellen, ob ein nicht abgelaufenes Token vorhanden ist, das zurückgegeben wird. Wenn kein Zugriffstoken gefunden wird oder das gefundene Zugriffstoken abgelaufen ist, wird versucht, mithilfe seines Aktualisierungstokens ein aktuelles Zugriffstoken zu beziehen. Wenn die 24-Stunden-Lebensdauer des Refresh-Tokens ebenfalls abgelaufen ist, öffnet MSAL.js einen versteckten Iframe, um unter Verwendung der bestehenden aktiven Sitzung mit Microsoft Entra ID (falls vorhanden) unauffällig einen neuen Autorisierungscode anzufordern, der dann gegen einen neuen Satz von Token (Zugriffs- und Aktualisierungstoken) ausgetauscht wird. Weitere Informationen zu Sitzungen mit einmaligem Anmelden (SSO) und Werten für die Tokengültigkeitsdauer in Microsoft Entra ID finden Sie unter Tokengültigkeitsdauer. Weitere Informationen zur Cachesuchrichtlinie für MSAL.js finden Sie unter Beziehen eines Zugriffstokens.

Beim Senden von automatischen Tokenanforderungen an Microsoft Entra ID können beispielsweise aufgrund einer Kennwortänderung oder aktualisierter Richtlinien für bedingten Zugriff Fehler auftreten. Häufiger sind auftretende Fehler darauf zurückzuführen, dass die 24-stündige Gültigkeitsdauer des Aktualisierungstokens abläuft und der Browser Cookies von Drittanbietern blockiert, wodurch die Verwendung von ausgeblendeten IFrames zur weiteren Authentifizierung des Benutzers verhindert wird. In diesen Fällen sollten Sie zum Abrufen von Token eine der interaktiven Methoden aufrufen (die den Benutzer dazu auffordern):

Auswählen zwischen einem Popupfenster oder einer Umleitung

Die Entscheidung für ein Popupfenster oder eine Umleitung hängt von Ihrem Anwendungsfluss ab:

  • Wenn Sie nicht möchten, dass Benutzer während der Authentifizierung Ihre Hauptanwendungsseite verlassen, wird die Popupmethode empfohlen. Da die Authentifizierungsumleitung in einem Popupfenster erfolgt, wird der Status der Hauptanwendung beibehalten.

  • Wenn für Benutzer Browsereinschränkungen oder Richtlinien gelten, bei denen Popupfenster deaktiviert sind, können Sie die Umleitungsmethode verwenden. Wenn Sie Internet Explorer als Browser nutzen, verwenden Sie die Umleitungsmethode, weil in Internet Explorer bekannte Probleme mit Popupfenstern bestehen.

Sie können beim Erstellen der Zugriffstokenanforderung die API-Bereiche festlegen, die das Zugriffstoken einschließen soll. Möglicherweise werden nicht alle angeforderten Bereiche im Zugriffstoken gewährt. Das ist von der Zustimmung des Benutzers abhängig.

Abrufen eines Tokens mit einem Popupfenster

Im folgenden Code wird das zuvor beschriebene Muster mit den Methoden für ein Popupelement kombiniert:

// MSAL.js v2 exposes several account APIs, logic to determine which account to use is the responsibility of the developer
const account = publicClientApplication.getAllAccounts()[0];

const accessTokenRequest = {
  scopes: ["user.read"],
  account: account,
};

publicClientApplication
  .acquireTokenSilent(accessTokenRequest)
  .then(function (accessTokenResponse) {
    // Acquire token silent success
    let accessToken = accessTokenResponse.accessToken;
    // Call your API with token
    callApi(accessToken);
  })
  .catch(function (error) {
    //Acquire token silent failure, and send an interactive request
    if (error instanceof InteractionRequiredAuthError) {
      publicClientApplication
        .acquireTokenPopup(accessTokenRequest)
        .then(function (accessTokenResponse) {
          // Acquire token interactive success
          let accessToken = accessTokenResponse.accessToken;
          // Call your API with token
          callApi(accessToken);
        })
        .catch(function (error) {
          // Acquire token interactive failure
          console.log(error);
        });
    }
    console.log(error);
  });

Abrufen eines Tokens mit einer Umleitung

Das folgende Muster entspricht dem zuvor beschriebenen Muster, wird jedoch mit einer Umleitungsmethode zum interaktiven Abrufen von Token dargestellt. Sie müssen handleRedirectPromise beim Laden der Seite aufrufen und abwarten.

const redirectResponse = await publicClientApplication.handleRedirectPromise();
if (redirectResponse !== null) {
  // Acquire token silent success
  let accessToken = redirectResponse.accessToken;
  // Call your API with token
  callApi(accessToken);
} else {
  // MSAL.js v2 exposes several account APIs, logic to determine which account to use is the responsibility of the developer
  const account = publicClientApplication.getAllAccounts()[0];

  const accessTokenRequest = {
    scopes: ["user.read"],
    account: account,
  };

  publicClientApplication
    .acquireTokenSilent(accessTokenRequest)
    .then(function (accessTokenResponse) {
      // Acquire token silent success
      // Call API with token
      let accessToken = accessTokenResponse.accessToken;
      // Call your API with token
      callApi(accessToken);
    })
    .catch(function (error) {
      //Acquire token silent failure, and send an interactive request
      console.log(error);
      if (error instanceof InteractionRequiredAuthError) {
        publicClientApplication.acquireTokenRedirect(accessTokenRequest);
      }
    });
}

Nächste Schritte

Fahren Sie mit dem nächsten Artikel in diesem Szenario fort: Aufrufen einer Web-API.