Freigeben über


MSAL2-Anbieter

Der MSAL2-Anbieter basiert auf dem MSAL-Browser, der den OAuth 2.0-Autorisierungscodeflow mit PKCE implementiert. Es wird verwendet, um Benutzer anzumelden und Token für die Verwendung mit Microsoft Graph abzurufen.

Weitere Informationen finden Sie unter Anbieter.

Erste Schritte

Sie können den MSAL2-Anbieter in HTML oder JavaScript initialisieren.

Initialisieren auf der HTML-Seite

Das Initialisieren des MSAL2-Anbieters in HTML ist die einfachste Möglichkeit, einen neuen Anbieter zu erstellen. Verwenden Sie die mgt-msal2-provider -Komponente, um die Client-ID und andere Eigenschaften festzulegen. Dadurch wird eine neue PublicClientApplication instance erstellt, die für alle Authentifizierungs- und Abruftoken verwendet wird.

    <mgt-msal2-provider client-id="<YOUR_CLIENT_ID>"
                        login-type="redirect/popup"
                        scopes="user.read,people.read"
                        redirect-uri="https://my.redirect/uri"
                        authority="">
    </mgt-msal2-provider>
Attribut Beschreibung
Client-ID Zeichenfolgenclient-ID (siehe Erstellen einer App-/Client-ID). Erforderlich.
login-type Enumeration zwischen redirect und popup - Standardwert ist redirect. Optional.
Bereiche Durch Trennzeichen getrennte Zeichenfolgen für Bereiche, denen der Benutzer bei der Anmeldung zustimmen muss. Optional.
custom-hosts Durch Trennzeichen getrennte Zeichenfolgen für weitere Domänen, die der Microsoft Graph-Client aufrufen kann. Optional.
Autorität Autoritätszeichenfolge: Der Standardwert ist die allgemeine Autorität. Verwenden Sie für Einzelmandanten-Apps Ihre Mandanten-ID oder Ihren Mandantennamen. Zum Beispiel https://login.microsoftonline.com/[your-tenant-contoso.com oder https://login.microsoftonline.com/[your-tenant-id]. Optional.
redirect-URI Umleitungs-URI-Zeichenfolge: Standardmäßig wird der aktuelle Fenster-URI verwendet. Optional.
Ansage Typ der Für die Anmeldung zu verwendenden Eingabeaufforderung zwischen SELECT_ACCOUNT, CONSENTund LOGIN. Der Standardwert ist SELECT_ACCOUNT. Optional.
base-url Der Microsoft Graph-Endpunkt, der für Microsoft Graph-Aufrufe verwendet werden soll. Dies kann jede der unterstützten nationalen Cloudbereitstellungen sein. Der Standardwert ist https://graph.microsoft.com.
Inkrementelle Zustimmung deaktiviert Gibt an, ob die inkrementelle Zustimmung deaktiviert ist. Standard.false Optional.

Initialisieren in JavaScript

Sie können weitere Optionen bereitstellen, indem Sie den Anbieter in JavaScript initialisieren.

    import {Providers} from '@microsoft/mgt-element';
    import {Msal2Provider, Msal2Config, Msal2PublicClientApplicationConfig} from '@microsoft/mgt-msal2-provider';

    // initialize the auth provider globally
    Providers.globalProvider = new Msal2Provider(config: Msal2Config | Msal2PublicClientApplicationConfig);

Sie können den Msal2Provider Konstruktorparameter auf zwei Arten konfigurieren, wie in den folgenden Abschnitten beschrieben.

Geben Sie ein clientId an, um eine neue zu erstellen. PublicClientApplication

Diese Option ist sinnvoll, wenn das Microsoft Graph-Toolkit für die gesamte Authentifizierung in Ihrer Anwendung verantwortlich ist.

interface Msal2Config {
  clientId: string;
  scopes?: string[];
  customHosts?: string[];
  authority?: string;
  redirectUri?: string;
  loginType?: LoginType; // LoginType.Popup or LoginType.Redirect (redirect is default)
  prompt?: PromptType; // PromptType.CONSENT, PromptType.LOGIN or PromptType.SELECT_ACCOUNT
  sid?: string; // Session ID
  loginHint?: string;
  domainHint?: string;
  isIncrementalConsentDisabled?: boolean, //Disable incremental consent, true by default
  options?: Configuration // msal-browser Configuration object
}

Übergeben Sie ein vorhandenes PublicClientApplication in der publicClientApplication -Eigenschaft.

Verwenden Sie dies, wenn Ihre App MSAL-Funktionen verwendet, die über die funktionen hinausgeht, die durch die Msal2Provider Features und andere Microsoft Graph Toolkits verfügbar gemacht werden. Dies ist geeignet, wenn ein Framework automatisch instanziiert und für Sie verfügbar macht PublicClientApplication , z. B. bei Verwendung von MSAL-angular. Weitere Informationen finden Sie im angular-app Beispiel im Microsoft Graph-Toolkit-Repository.

Achten Sie darauf, die Möglichkeiten für Kollisionen zu verstehen, wenn Sie diese Option verwenden. Von Natur aus besteht das Risiko, dass der Msal2Provider den Zustand einer Sitzung ändern kann, z. B. indem der Benutzer sich anmeldet oder zusätzlichen Bereichen zustimmt. Stellen Sie sicher, dass Ihre App und andere Frameworks ordnungsgemäß auf diese Zustandsänderungen reagieren, oder erwägen Sie stattdessen die Verwendung eines benutzerdefinierten Anbieters .

interface Msal2PublicClientApplicationConfig {
  publicClientApplication: PublicClientApplication;
  scopes?: string[];
  customHosts?: string[];
  authority?: string;
  redirectUri?: string;
  loginType?: LoginType; // LoginType.Popup or LoginType.Redirect (redirect is default)
  prompt?: PromptType; // PromptType.CONSENT, PromptType.LOGIN or PromptType.SELECT_ACCOUNT
  sid?: string; // Session ID
  loginHint?: string;
  domainHint?: string;
  isIncrementalConsentDisabled?: boolean, //Disable incremental consent, true by default
  options?: Configuration // msal-browser Configuration object
}

Verwenden eines anderen Cloudendpunkts

Verwenden Sie diese Option, wenn Sie das Toolkit verwenden möchten, um Ihre Daten von einem anderen Microsoft 365-Endpunkt zu rendern.

import {Providers, Msal2Provider} from '@microsoft/mgt'

const config: Msal2Config = {
  baseUrl: 'https://graph.microsoft.us', // change the base URL
  clientId: '2dfea037-xxx-c05708a1b241',
  ... // rest of the config
}

Providers.globalProvider = new Msal2Provider(config);

Alternativ:

<mgt-msal2-provider
      client-id="2dfea037-xxx-c05708a1b241"
      redirect-uri="http://localhost:3000"
      base-url="https://dod-graph.microsoft.us"
      scopes="user.read,user.read.all">
</mgt-msal2-provider>

Um die benutzerdefinierten APIs aufzurufen, fordern Sie diesen API-Bereich an.

<mgt-get resource="https://myapi.com/v1.0/api" scopes="api://CUSTOM_API_GUID/SCOPE">
  ...
</mgt-get>

Oder über JavaScript/Typescript.

import { prepScopes } from "@microsoft/mgt-element";

graphClient
  .api("https://myapi.com/v1.0/api")
  .middlewareOptions(prepScopes("api://CUSTOM_API_GUID/SCOPE"))
  .get();
...

Verwenden von benutzerdefinierten Hosts zum Aufrufen verschiedener Microsoft Entra ID gesicherter Endpunkte

Wenn Sie Ihre eigenen benutzerdefinierten Microsoft Entra ID geschützten Endpunkte aufrufen möchten, übergeben Sie diese Domänen an den zugrunde liegenden Microsoft Graph-Client.

import {Providers, Msal2Provider} from '@microsoft/mgt'

const config: Msal2Config = {
  clientId: '2dfea037-xxx-c05708a1b241',
  customHosts: ['mydomain.com'] //array of domains, not urls!
  ... // rest of the config
}

Providers.globalProvider = new Msal2Provider(config);

Alternativ:

<mgt-msal2-provider
      client-id="2dfea037-xxx-c05708a1b241"
      redirect-uri="http://localhost:3000"
      custom-hosts="mydomain.com"
      scopes="user.read,user.read.all">
</mgt-msal2-provider>

Erstellen einer App-/Client-ID

Ausführliche Informationen zum Registrieren einer App und zum Abrufen einer Client-ID finden Sie unter Erstellen einer Microsoft Entra-App.

Migrieren vom MSAL-Anbieter zum MSAL2-Anbieter

So migrieren Sie eine Anwendung, die den MSAL-Anbieter verwendet, zum MSAL2-Anbieter:

  1. Wechseln Sie zum Microsoft Entra Admin Center.

  2. Erweitern Sie das Menü >Identität, erweitern Sie Anwendungen> und wählen Sie App-Registrierungen aus.

  3. Wählen Sie die App-Registrierung der zu migrierenden App aus.

  4. Wechseln Sie im linken Menü zu Authentifizierung .

  5. Wählen Sie unter Plattformkonfigurationen die Option Plattform hinzufügen und dann Einzelseitenanwendung aus.

  6. Entfernen Sie alle Umleitungs-URIs, die Sie derzeit unter Web registriert haben, und fügen Sie sie stattdessen unter Single-Page-Anwendung hinzu.

  7. Ersetzen MSALProvider Sie in Ihrem Code durch MSAL2Provider.

    Wenn Sie Ihren Anbieter im JS/TS-Code initialisieren, führen Sie die folgenden Schritte aus:

    Ersetzen Sie die Import-Anweisung für durch mgt-MSAL-provider .

    import {Msal2Provider, PromptType} from '@microsoft/mgt-msal2-provider';
    

    Ersetzen Sie die Initialisierung von MsalProvider durch.

    Providers.globalProvider = new Msal2Provider({
      clientId: 'REPLACE_WITH_CLIENTID'
      ...
    })
    

    Wenn Sie den Anbieter in HTML initialisieren, ersetzen Sie

    <mgt-msal-provider client-id="" ... ></mgt-msal-provider>
    

    mit

    <mgt-msal2-provider  client-id="" ... ></mgt-msal2-provider>
    

    Weitere Informationen finden Sie unter Initialisieren auf Ihrer HTML-Seite.