Ir para o console

Autenticar usando a Microsoft com JavaScript

Permita que os usuários se autentiquem com o Firebase usando provedores OAuth, como o Microsoft Azure Active Directory. Basta integrar o login genérico do OAuth ao seu app usando o SDK do Firebase para realizar o fluxo de login completo.

Antes de começar

Para fazer login de usuários usando contas da Microsoft (Azure Active Directory e contas pessoais da Microsoft), primeiro ative a Microsoft como um provedor de login do seu projeto do Firebase:

  1. Adicione o Firebase ao seu projeto do JavaScript.
  2. No Console do Firebase, abra a seção Auth.
  3. Na guia Método de login, ative o provedor Microsoft.
  4. Adicione o ID do cliente e a chave secreta do cliente do console de desenvolvimento às configurações do provedor.
    1. Para registrar um cliente OAuth da Microsoft, siga as instruções em Guia de início rápido: como registrar um app com o endpoint do Azure Active Directive 2.0 (em inglês). Observe que esse endpoint é compatível com login por meio de contas pessoais da Microsoft, bem como de contas do Azure Active Directory. Saiba mais sobre o Azure Active Directory v2.0 (em inglês).
    2. Ao registrar apps nesses provedores, registre o domínio *.firebaseapp.com do seu projeto como o domínio de redirecionamento do seu aplicativo.
  5. Clique em Salvar.

Processar o fluxo de login com o SDK do Firebase

Se você está desenvolvendo um app da Web, a maneira mais fácil de autenticar seus usuários com o Firebase usando contas da Microsoft é processando o fluxo de login com o SDK do Firebase para JavaScript.

Para processar o fluxo de login com o SDK do Firebase para JavaScript, siga estas etapas:

  1. Crie uma instância de um OAuthProvider usando o código de provedor microsoft.com.

    var provider = new firebase.auth.OAuthProvider('microsoft.com');
    
  2. Opcional: especifique os parâmetros OAuth personalizados que você quer enviar com a solicitação OAuth.

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

    Para saber quais parâmetros são aceitos pela Microsoft, consulte a documentação do OAuth da Microsoft (em inglês). Não é possível transmitir os parâmetros exigidos pelo Firebase com setCustomParameters(). Esses parâmetros são client_id, response_type, redirect_uri, state, scope e response_mode.

  3. Opcional: especifique os outros escopos de OAuth 2.0 além do perfil básico que você quer solicitar ao provedor de autenticação.

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

    Para saber mais, consulte a documentação de permissões e consentimento da Microsoft (em inglês).

  4. Use o objeto de provedor do OAuth para a autenticação no Firebase. Você pode solicitar que os usuários façam login nas contas da Microsoft deles em uma nova janela pop-up ou os redirecionando para a página de login. O método de redirecionamento é recomendável para dispositivos móveis.

    • Para fazer login com uma janela pop-up, chame signInWithPopup:

      firebase.auth().signInWithPopup(provider)
        .then(function(result) {
          // User is signed in.
          // IdP data available in result.additionalUserInfo.profile.
          // OAuth access token can also be retrieved:
          // result.credential.accessToken
        })
        .catch(function(error) {
          // Handle error.
        });
      
    • Para redirecionar os usuários à página de login, chame signInWithRedirect:

      firebase.auth().signInWithRedirect(provider);
      

      Depois que o usuário fizer login e retornar à página, você poderá ver o resultado do login chamando getRedirectResult.

      firebase.auth().getRedirectResult()
        .then(function(result) {
          // User is signed in.
          // IdP data available in result.additionalUserInfo.profile.
          // OAuth access token can also be retrieved:
          // result.credential.accessToken
        })
        .catch(function(error) {
          // Handle error.
        });
      

    Se o processo foi bem-sucedido, o token de acesso OAuth associado ao provedor pode ser recuperado com o objeto firebase.auth..UserCredential retornado.

    Com o token de acesso OAuth, é possível chamar a API Microsoft Graph (em inglês).

    Por exemplo, para receber as informações básicas do perfil, é possível chamar a seguinte API REST:

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

    Ao contrário de outros provedores compatíveis com o Firebase Auth, a Microsoft não fornece um URL de foto. Em vez disso, os dados binários de uma foto de perfil precisam ser solicitados por meio da API Microsoft Graph (em inglês).

  5. Embora os exemplos acima se concentrem nos fluxos de login, também é possível vincular um provedor da Microsoft a um usuário existente usando linkWithPopup/linkWithRedirect. Por exemplo, você pode vincular vários provedores ao mesmo usuário permitindo o login com qualquer um deles.

    var provider = new firebase.auth.OAuthProvider('microsoft.com');
    firebase.auth().currentUser.linkWithPopup(provider)
        .then(function(result) {
          // Microsoft credential is linked to the current user.
          // IdP data available in result.additionalUserInfo.profile.
          // OAuth access token can also be retrieved:
          // result.credential.accessToken
        })
        .catch(function(error) {
          // Handle error.
        });
    
  6. É possível usar o mesmo padrão com reauthenticateWithPopupreauthenticateWithRedirect, que pode ser utilizado para recuperar credenciais novas de operações confidenciais que exigem um login recente.

    var provider = new firebase.auth.OAuthProvider('microsoft.com');
    firebase.auth().currentUser.reauthenticateWithPopup(provider)
        .then(function(result) {
          // User is re-authenticated with fresh tokens minted and
          // should be able to perform sensitive operations like account
          // deletion and email or password update.
          // IdP data available in result.additionalUserInfo.profile.
          // OAuth access token can also be retrieved:
          // result.credential.accessToken
        })
        .catch(function(error) {
          // Handle error.
        });
    

Autenticar com Firebase em uma extensão do Chrome

Se você estiver criando um app de Extensão do Chrome, coloque o código da extensão na lista de permissões:

  1. Abra seu projeto no Firebase console.
  2. Na seção Autenticação, abra a página Método de login.
  3. Adicione um URI como o seguinte à lista de domínios autorizados:
    chrome-extension://CHROME_EXTENSION_ID

Somente as operações pop-up (signInWithPopup e linkWithPopup) estão disponíveis para as Extensões do Chrome. Isso ocorre porque as extensões não podem usar redirecionamentos HTTP. Chame esses métodos a partir de um script em segundo plano porque, se usar o pop-up de ação do navegador, ele será cancelado pelo pop-up de autenticação.

No arquivo de manifesto da sua extensão do Chrome, adicione o URL https://apis.google.com à lista de permissões content_security_policy.

Próximas etapas

Depois que um usuário faz login pela primeira vez, uma nova conta é criada e vinculada às credenciais, que podem ser o número do telefone, o nome de usuário e a senha ou as informações do provedor de autenticação. Essa nova conta é armazenada como parte do projeto do Firebase. Ela pode ser usada para identificar um usuário em todos os apps do projeto, independentemente do método de login usado.

  • Nos seus apps, a maneira recomendada para descobrir o status de autenticação do usuário é definir um observador no objeto Auth. Você pode coletar as informações básicas do perfil do usuário do objeto User. Consulte Gerenciar usuários.

  • Nas Regras de segurança do Firebase Realtime Database e do Cloud Storage, é possível usar a variável auth para encontrar o código exclusivo do usuário conectado. Use essa informação para controlar os dados que os usuários podem acessar.

Os usuários podem fazer login no app usando vários provedores de autenticação. Para fazer isso, basta vincular as credenciais desses provedores a uma conta de usuário.

Para desconectar um usuário, chame signOut:

firebase.auth().signOut().then(function() {
  // Sign-out successful.
}).catch(function(error) {
  // An error happened.
});