Fournisseur MSAL2

Le fournisseur MSAL2 repose sur MSAL-browser qui implémente le flux de code d’autorisation OAuth 2.0 avec PKCE. Il est utilisé pour connecter des utilisateurs et acquérir des jetons à utiliser avec Microsoft Graph.

Pour en savoir plus, consultez fournisseurs.

Prise en main

Vous pouvez initialiser le fournisseur MSAL2 en HTML ou JavaScript.

Initialiser dans votre page HTML

L’initialisation du fournisseur MSAL2 au format HTML est le moyen le plus simple de créer un nouveau fournisseur. Utilisez le mgt-msal2-provider composant pour définir l’id client et d’autres propriétés. Cela crée une nouvelle PublicClientApplication instance qui est utilisée pour toutes les authentifications et l’acquisition de jetons.

    <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>

Initialiser dans JavaScript

Vous pouvez fournir d’autres d’options en initialisant le fournisseur dans JavaScript.

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

Vous pouvez configurer le paramètre de Msal2Provider constructeur de deux façons, comme décrit dans les sections suivantes.

Fournir un clientId pour créer un nouveau PublicClientApplication

Cette option est logique lorsque le Kit de ressources Microsoft Graph est responsable de toute l’authentification dans votre application.

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
}

Passez un existant PublicClientApplication dans la publicClientApplication propriété .

Utilisez-la lorsque votre application utilise la fonctionnalité MSAL au-delà de ce qui est exposé par et d’autres fonctionnalités du Msal2Provider Kit de ressources Microsoft Graph. Cela est approprié si une infrastructure instancie et expose automatiquement un PublicClientApplication pour vous, par exemple, lors de l’utilisation de MSAL-angular. Pour plus d’informations, consultez l’exemple angular-app dans le référentiel du Kit de ressources Microsoft Graph.

Veillez à comprendre les possibilités de collisions lors de l’utilisation de cette option. Par nature, il existe un risque que le Msal2Provider puisse changer l’état d’une session, par exemple en demandant à l’utilisateur de se connecter ou de donner son consentement à des étendues supplémentaires. Assurez-vous que votre application et d’autres infrastructures répondent correctement à ces changements d’état, ou envisagez d’utiliser un fournisseur personnalisé à la place.

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
}

Utiliser un autre point de terminaison cloud

Utilisez cette option lorsque vous souhaitez utiliser le kit de ressources pour afficher vos données à partir d’un autre point de terminaison Microsoft 365.

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

Alternativement:

<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>

Pour appeler les API personnalisées, demandez cette étendue d’API.

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

Ou via JavaScript/Typescript.

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

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

Utiliser des hôtes personnalisés pour appeler différents points de terminaison sécurisés Microsoft Entra ID

Si vous souhaitez appeler vos propres points de terminaison sécurisés Microsoft Entra ID personnalisés, transmettez ces domaines au client Microsoft Graph sous-jacent.

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

Alternativement:

<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>

Création d’un ID client/application

Pour plus d’informations sur l’inscription d’une application et l’obtention d’un ID client, consultez Créer une application Microsoft Entra.

Migration du fournisseur MSAL vers le fournisseur MSAL2

Pour migrer une application qui utilise le fournisseur MSAL vers le fournisseur MSAL2 :

1. Accédez au centre d’administration Microsoft Entra.

2. Développez le menu >Identité, développez Applications>, sélectionnez inscriptions d'applications.

3. Sélectionnez l’inscription de l’application à migrer.

4. Accédez à Authentification dans le menu de gauche.

5. Sous Configurations de plateforme, sélectionnez Ajouter une plateforme , puis Application monopage.

6. Supprimez tous les URI de redirection que vous avez actuellement inscrits sous Web, puis ajoutez-les sous Application monopage.

7. Dans votre code, remplacez par MSALProviderMSAL2Provider.

   Si vous initialisez votre fournisseur dans le code JS/TS, procédez comme suit :

   Remplacez l’instruction import pour par mgt-MSAL-provider

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

   Remplacez l’initialisation de MsalProvider par

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

   Si vous initialisez le fournisseur au format HTML, remplacez

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

   avec

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

   Pour plus d’informations, consultez Initialiser dans votre page HTML.