Ir para o console

Autenticar usando o Yahoo com JavaScript

Permita que os usuários se autentiquem com o Firebase usando provedores OAuth, como o Yahoo. 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 do Yahoo, primeiro ative o Yahoo 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 Yahoo.
  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 do Yahoo, siga as instruções do Yahoo sobre como registrar um aplicativo da Web no Yahoo.
    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 do Yahoo é processando todo 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 yahoo.com.

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

    provider.setCustomParameters({
      // Prompt user to re-authenticate to Yahoo.
      prompt: 'login',
      // Localize to French.
      language: 'fr'
    });
    

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

  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. Se o aplicativo exigir acesso a dados particulares de usuários das APIs do Yahoo, você precisará solicitar permissões em Permissões de API no console de desenvolvimento do Yahoo. Os escopos OAuth solicitados precisam corresponder exatamente àqueles pré-configurados nas permissões da API do app. Por exemplo, se o acesso de leitura/gravação for obrigatório para os contatos do usuário e estiver pré-configurado nas permissões da API do aplicativo, será preciso transmitir sdct-w, e não o escopo somente leitura sdct-r do OAuth. Caso contrário, o fluxo falhará e um erro será mostrado ao usuário final.

    // Request access to Yahoo Mail API.
    provider.addScope('mail-r');
    // Request read/write access to user contacts.
    // This must be preconfigured in the app's API permissions.
    provider.addScope('sdct-w');
    

    Para saber mais, consulte a documentação do escopo do Yahoo (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.
          // Yahoo OAuth access token can be retrieved by calling:
          // result.credential.accessToken
          // Yahoo OAuth ID token can be retrieved by calling:
          // result.credential.idToken
        })
        .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.
          // Yahoo OAuth access token can be retrieved by calling:
          // result.credential.accessToken
          // Yahoo OAuth ID token can be retrieved by calling:
          // result.credential.idToken
        })
        .catch(function(error) {
          // Handle error.
        });
      

    Se o processo foi bem-sucedido, o token de código e o token de acesso OAuth associados ao provedor podem ser recuperados com o objeto firebase.auth.UserCredential retornado.

    Com o token de acesso OAuth, é possível chamar a API do Yahoo (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://social.yahooapis.com/v1/user/YAHOO_USER_UID/profile?format=json
    

    Em que YAHOO_USER_UID é o ID do usuário do Yahoo, que pode ser recuperado com o campo firebase.auth().currentUser.providerData[0].uid ou result.additionalUserInfo.profile.

  5. Embora os exemplos acima se concentrem nos fluxos de login, também é possível vincular um provedor do Yahoo 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('yahoo.com');
    firebase.auth().currentUser.linkWithPopup(provider)
        .then(function(result) {
          // Yahoo credential is linked to the current user.
          // IdP data available in result.additionalUserInfo.profile.
          // Yahoo OAuth access token can be retrieved by calling:
          // result.credential.accessToken
          // Yahoo OAuth ID token can be retrieved by calling:
          // result.credential.idToken
        })
        .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('yahoo.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.
          // Yahoo OAuth access token can be retrieved by calling:
          // result.credential.accessToken
          // Yahoo OAuth ID token can be retrieved by calling:
          // result.credential.idToken
        })
        .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.
});