Provedor MSAL2

O provedor MSAL2 é criado no navegador MSAL que implementa o fluxo de código de autorização OAuth 2.0 com PKCE. É usado para conectar usuários e adquirir tokens para usar com o Microsoft Graph.

Para saber mais, consulte provedores.

Introdução

Você pode inicializar o provedor MSAL2 em HTML ou JavaScript.

Inicializar em sua página HTML

Inicializar o provedor MSAL2 em HTML é a maneira mais simples de criar um novo provedor. Use o mgt-msal2-provider componente para definir o client-id e outras propriedades. Isso cria uma nova PublicClientApplication instância que é usada para todos os tokens de autenticação e aquisição.

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

Inicializar no JavaScript

Você pode fornecer mais opções inicializando o provedor em 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);

Você pode configurar o Msal2Provider parâmetro constructor de duas maneiras, conforme descrito nas seções a seguir.

Forneça um clientId para criar um novo PublicClientApplication

Essa opção faz sentido quando o Microsoft Graph Toolkit é responsável por toda a autenticação em seu aplicativo.

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
}

Passe um existente PublicClientApplication na publicClientApplication propriedade.

Use isso quando seu aplicativo usar a funcionalidade MSAL além do exposto pelo e outros recursos do Msal2Provider Microsoft Graph Toolkit. Isso é apropriado se uma estrutura instanciar e expor automaticamente um PublicClientApplication para você; por exemplo, ao usar MSAL-angular. Para obter mais informações, consulte o angular-app exemplo no repositório do Microsoft Graph Toolkit.

Certifique-se de entender as oportunidades de colisões ao usar essa opção. Por sua própria natureza, existe o risco de que o possa alterar o estado de uma sessão; por exemplo, fazendo com que Msal2Provider o usuário entre ou consinta com escopos adicionais. Certifique-se de que seu aplicativo e outras estruturas respondam normalmente a essas alterações de estado ou considere usar um provedor personalizado .

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
}

Usar um ponto de extremidade de nuvem diferente

Use isso quando quiser usar o kit de ferramentas para renderizar seus dados de um ponto de extremidade diferente do 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);

Como alternativa:

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

Para chamar as APIs personalizadas, solicite que o escopo da 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();
...

Use hosts personalizados para chamar diferentes pontos de extremidade protegidos pelo Microsoft Entra ID

Se você quiser chamar seus próprios pontos de extremidade protegidos personalizados do Microsoft Entra ID, passe esses domínios para o cliente Microsoft Graph subjacente.

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

Como alternativa:

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

Criando uma ID de aplicativo/cliente

Para obter detalhes sobre como registrar um aplicativo e obter uma ID de cliente, consulte Criar um aplicativo do Microsoft Entra.

Migração do Provedor MSAL para o Provedor MSAL2

Para migrar um aplicativo que está usando o provedor MSAL para o provedor MSAL2:

1. Vá para o centro de administração do Microsoft Entra.

2. Expanda o menu >Identidade, expanda Aplicativos>, selecione Registros de aplicativo.

3. Selecione o registro do aplicativo a ser migrado.

4. Vá para Autenticação no menu à esquerda.

5. Em Configurações da plataforma, selecione Adicionar uma plataforma e selecione Aplicativo de página única.

6. Remova todos os URIs de redirecionamento que você registrou atualmente na Web e, em vez disso, adicione-os em Aplicativo de página única.

7. No código, substitua MSALProvider por MSAL2Provider.

   Se você inicializar o provedor no código JS/TS, siga estas etapas:

   Substitua a import instrução por mgt-MSAL-provider

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

   Substitua a inicialização de MsalProvider por

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

   Se você inicializar o provedor em HTML, substitua

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

   com

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

   Para obter detalhes, consulte Inicializar em sua página HTML.