Como fazer login de usuários com o Microsoft

Neste documento, mostramos como usar o Identity Platform para fazer login de usuários com a Microsoft. Contas da Microsoft pessoais e contas do Azure Active Directory (Azure AD) são compatíveis.

Antes de começar

Neste tutorial, pressupomos que você já tenha ativado o Identity Platform e tenha um aplicativo da Web básico escrito usando HTML e JavaScript. Consulte o Guia de início rápido para saber como.

Como configurar a Microsoft como um provedor

Para configurar a Microsoft como um provedor de identidade:

  1. Acesse a página Provedores de identidade no console do Google Cloud.

    Acessar a página "Provedores de identidade"

  2. Clique em Adicionar um provedor.

  3. Selecione Microsoft na lista.

  4. Digite o ID do app e o secret do app da Microsoft. Se você ainda não tiver um ID e um secret, siga as etapas em Guia de início rápido: registrar um app com o endpoint do Azure AD v2.0 para conseguir um.

    Esse endpoint é compatível com contas da Microsoft pessoais e do Azure AD. Consulte a Visão geral da plataforma de identidade da Microsoft (v2.0) para saber mais sobre o Azure AD.

  5. Configure o URI listado em Configurar Microsoft como o URI de redirecionamento OAuth válido para seu app da Microsoft. Se você tiver configurado um domínio personalizado no Identity Platform, atualize o URI de redirecionamento na configuração do app da Microsoft para usar o domínio personalizado em vez do domínio padrão. Por exemplo, altere https://myproject.firebaseapp.com/__/auth/handler para https://auth.myownpersonaldomain.com/__/auth/handler.

  6. Registre os domínios do seu aplicativo clicando em Adicionar domínio em Domínios autorizados. Para fins de desenvolvimento, localhost já está ativado por padrão.

  7. Em Configurar seu aplicativo, clique em Detalhes de configuração. Copie o snippet no código do aplicativo para inicializar o SDK do cliente do Identity Platform.

  8. Clique em Salvar.

Como conectar usuários com o SDK do cliente

  1. Crie uma instância do objeto OAuthProvider, passando microsoft.com como o ID do provedor:

    JavaScript 

    var provider = new firebase.auth.OAuthProvider('microsoft.com');
    microsoft-oauth.js

  2. Opcional: adicione escopos do OAuth. Os escopos especificam quais dados você está solicitando da Microsoft. Dados mais confidenciais podem exigir escopos específicos. Consulte a documentação da Microsoft para determinar quais escopos seu aplicativo precisa.

    JavaScript 

    provider.addScope('mail.read');
provider.addScope('calendars.read');

  3. Opcional: especifique outros parâmetros de OAuth personalizados. Eles são específicos da Microsoft e normalmente são usados para personalizar a experiência de autenticação.

    JavaScript 

    provider.setCustomParameters({
  // Force re-consent.
  prompt: 'consent',
  // Target specific email with login hint.
  login_hint: 'user@firstadd.onmicrosoft.com'
});

    É possível usar o parâmetro mkt para personalizar a linguagem do fluxo de autenticação. Exemplo:

    provider.setCustomParameters({
  mkt: 'fr'
});

    Use a propriedade tenant para limitar o acesso a usuários fora de um domínio específico do Azure AD. Especifique o nome de domínio amigável do locatário ou seu identificador GUID. Os usuários que não estiverem nesse domínio não poderão fazer login. Exemplo:

    provider.setCustomParameters({
  // Optional "tenant" parameter in case you are using an Azure AD tenant.
  // eg. '8eaef023-2b34-4da1-9baa-8bc8c9d6a490' or 'contoso.onmicrosoft.com'
  // or "common" for tenant-independent tokens.
  // The default value is "common".
  tenant: 'TENANT_ID'
});

    Consulte a documentação do OAuth da Microsoft para ver uma lista completa de parâmetros compatíveis com a Microsoft. Não é possível transmitir parâmetros reservados pelo OAuth ou pelo Identity Platform.

  4. Use o objeto OAuthProvider para fazer login do usuário. É possível abrir uma janela pop-up ou redirecionar a página atual. O redirecionamento é mais fácil para usuários em dispositivos móveis.

    Para mostrar um pop-up, chame signInWithPopup():

    JavaScript 

    firebase.auth().signInWithPopup(provider)
  .then((result) => {
    // IdP data available in result.additionalUserInfo.profile.
    // ...

    /** @type {firebase.auth.OAuthCredential} */
    var credential = result.credential;

    // OAuth access and id tokens can also be retrieved:
    var accessToken = credential.accessToken;
    var idToken = credential.idToken;
  })
  .catch((error) => {
    // Handle error.
  });
    microsoft-oauth.js

    Para redirecionar a página, primeiro chame signInWithRedirect():

    Siga as práticas recomendadas ao usar signInWithRedirect, linkWithRedirect ou reauthenticateWithRedirect.

    JavaScript 

    firebase.auth().signInWithRedirect(provider);
    microsoft-oauth.js

    Em seguida, recupere o token da Microsoft chamando getRedirectResult() quando sua página for carregada:

    JavaScript 

    firebase.auth().getRedirectResult()
  .then((result) => {
    // IdP data available in result.additionalUserInfo.profile.
    // ...

    /** @type {firebase.auth.OAuthCredential} */
    var credential = result.credential;

    // OAuth access and id tokens can also be retrieved:
    var accessToken = credential.accessToken;
    var idToken = credential.idToken;
  })
  .catch((error) => {
    // Handle error.
  });
    microsoft-oauth.js

Com um token de acesso, é possível usá-lo para chamar a API Microsoft Graph, por exemplo:

REST 

curl -i -H "Authorization: Bearer [ACCESS_TOKEN]" https://graph.microsoft.com/v1.0/me

Diferentemente de outros provedores compatíveis com o Identity Platform, a Microsoft não fornece um URL de foto para os usuários. Em vez disso, será necessário usar a API Graph para solicitar os dados binários da foto.

Além do token de acesso, é possível recuperar o token de ID da Microsoft de um usuário. A declaração oid desse token contém um ID exclusivo para o usuário. É possível comparar isso com o ID localizado em user.providerData[0].uid. Se os usuários estiverem fazendo login com um locatário do Azure AD, esses campos corresponderão exatamente. Se não estiverem, o campo será preenchido com zeros (por exemplo, o ID federado 4b2eabcdefghijkl aparecerá como 00000000-0000-0000-4b2e-abcdefghijkl).

Não use a declaração sub para comparar IDs de usuário. A declaração sub é específica do app e não corresponderá ao ID usado pela Microsoft.

Como fazer login manual dos usuários

Outros provedores do Identity Platform, como Google, Facebook e Twitter, permitem que você faça login dos usuários manualmente chamando signInWithCredential().

Esse recurso não é compatível com a Microsoft. O Identity Platform não consegue verificar o público dos tokens de acesso do Microsoft OAuth, que é um requisito de segurança crítico.

Se não for possível usar o SDK do cliente do Identity Platform para fazer login dos usuários, será necessário usar uma biblioteca OAuth de terceiros para fazer a autenticação com a Microsoft. Depois, use a autenticação personalizada para trocar a credencial da Microsoft por um token personalizado.

A seguir