Logon social com o Facebook e o Twitter social-login-with-facebook-and-twitter

Logon social é a capacidade de apresentar a um visitante do site a opção de fazer logon com sua conta do Facebook ou do Twitter. Portanto, incluir dados de Facebook ou Twitter permitidos em seu perfil de membro AEM.

socialloginweretail

Visão geral do logon social social-login-overview

Para incluir o logon social, é necessário criar aplicativos personalizados do Facebook e do Twitter.

Embora o exemplo de we-retail forneça exemplos de aplicativos Facebook e Twitter e de serviços na nuvem, eles não estão disponíveis em um site de produção.

As etapas necessárias são:

  1. Habilite a autenticação OAuth em todas as instâncias de publicação do AEM.

    Sem o OAuth habilitado, as tentativas de logon falham.

  2. Crie um aplicativo social e um serviço na nuvem.

  3. Habilitar logon social para um site da comunidade.

Há dois conceitos básicos:

  1. Escopo (permissões) especifica os dados que o aplicativo tem permissão para solicitar.

  2. Campos (parâmetros) especifica os dados reais solicitados usando parâmetros de URL.

Logon no facebook facebook-login

Versão da API do facebook facebook-api-version

O logon social e a amostra do We-retail Facebook foram desenvolvidos quando a API Graph do Facebook era a versão 1.0.
A partir do AEM 6.4 GA e AEM 6.3 SP1, o logon social foi atualizado para funcionar com a versão mais recente da API de gráfico 2.5 do Facebook.

NOTE
Para versões mais antigas do AEM, se você estiver enfrentando uma exceção nos logs Não é possível extrair um token deste, atualize para o CFP mais recente para essa versão do AEM.

Para obter informações sobre a versão da API do Facebook Graph, consulte o changelog da API Facebook.

Criar um aplicativo Facebook create-a-facebook-app

Um aplicativo do Facebook corretamente configurado é necessário para habilitar o logon social do Facebook.

Para criar um aplicativo do Facebook, siga as instruções da Facebook em https://developers.facebook.com/apps/. As alterações nas instruções não se refletem nas informações a seguir.

Em geral, a partir da API do Facebook v2.7:

  • Adicionar um Novo Aplicativo Facebook

    • Para Plataforma, escolha Site:

      • Para URL do Site, digite https://<server>:<port>.
      • Para Nome para Exibição, insira um título para usar como o Título do serviço de conexão da Facebook.
      • Para Categoria, é recomendável escolher Aplicativos para Páginas, mas isso pode ser qualquer coisa.
      • Adicionar Produto: Logon do Facebook
      • Para URIs de redirecionamento OAuth válidos, digite https://<server>:<port>.
NOTE
Para desenvolvimento, http://localhost:4503 funcionará.

Depois que o aplicativo for criado, localize as configurações de ID do Aplicativo e Segredo do Aplicativo. Essas informações são necessárias para configurar o serviço de nuvem da Facebook.

Criar um Cloud Service de conexão Facebook create-a-facebook-connect-cloud-service

A instância do Provedor e Aplicativo OAuth do Adobe Granite, instanciada pela criação de uma configuração de serviço na nuvem, identifica o aplicativo Facebook e os grupos de membros aos quais os novos usuários são adicionados.

  1. Na instância do autor AEM, faça logon com privilégios de administrador.

  2. Na navegação global, selecione Ferramentas > Cloud Service > Configuração de logon do Facebook Social.

  3. Selecione o caminho de contexto da configuração.

    O caminho do contexto deve ser o mesmo que o caminho de configuração da nuvem selecionado ao criar/editar um site da comunidade.

  4. Verifique se o caminho de contexto está habilitado para criar serviços de nuvem abaixo dele.

  5. Vá para Ferramentas > Geral > Navegador de Configuração. Selecione o contexto e edite as propriedades. Habilite as Configurações de nuvem se ainda não estiver habilitado.

    config-propertiespng

  6. Criar/Editar configuração do serviço de nuvem Facebook.

    fbsocialloginconfigpng

    • Título (Obrigatório) Insira um título de exibição que identifique o aplicativo Facebook. Use o mesmo nome inserido como Nome para Exibição para o aplicativo Facebook.
    • Chave do Aplicativo/da API (Obrigatório) Insira a ID do Aplicativo para o Aplicativo Facebook. Isso identifica a instância Provedor e Aplicativo OAuth do Adobe Granite criada a partir da caixa de diálogo.
    • Segredo do Aplicativo (Obrigatório) Insira o Segredo do Aplicativo para o Aplicativo Facebook.
    • Criar usuários Se marcado, fazer logon com uma conta do Facebook criará uma entrada de usuário AEM e a adicionará como membro ao(s) grupo(s) de usuários selecionado(s). O padrão está marcado (altamente recomendado).
    • Mascarar IDs de Usuários: Deixe desmarcado.
    • Email do Escopo: a ID de email do usuário deve ser buscada no Facebook.
    • Adicionar a Grupos de Usuários selecione Adicionar Grupo de Usuários para escolher um ou mais grupos de membros para o site da comunidade ao qual os usuários serão adicionados.
    note note
    NOTE
    Os grupos podem ser adicionados ou removidos a qualquer momento. Mas as associações de usuários existentes não são afetadas. A associação automática se aplica somente a novos usuários que estão sendo criados após a atualização desse campo. Para os sites em que os usuários anônimos estão desativados, opte por adicionar usuários ao grupo de membros da comunidade correspondente destinado ao site fechado da comunidade.
    • Selecione SALVAR.
    • Publish.

Adobe O resultado é uma instância de Provedor e Aplicativo Granite OAuth que não requer mais modificações, a menos que o escopo adicional seja adicionado (permissões). O escopo padrão são as permissões padrão para logon no Facebook. Se desejar escopo adicional, é necessário editar a configuração OSGI diretamente. Se houver modificações feitas diretamente pelo sistema/console, evite editar as configurações do Cloud Service na interface para toque, evitando substituições.

Provedor OAuth do AEM Communities Facebook aem-communities-facebook-oauth-provider

O provedor AEM Communities estende a instância Aplicativo e Provedordo Adobe Granite OAuth.

Esse provedor exigirá edição para:

  • Permitir atualizações do usuário

  • Adicionar mais campos dentro do escopo

    • Nem todos os campos permitidos por padrão são incluídos por padrão.

Se a edição for necessária, em cada instância de publicação AEM:

  1. Faça logon com privilégios de administrador.

  2. Navegue até o Console da Web. Por exemplo, http://localhost:4503/system/console/configMgr.

  3. Localize o Provedor OAuth do AEM Communities Facebook.

  4. Selecione o ícone de lápis a ser aberto para edição.

    fboauthprov_png

    • ID do Provedor OAuth

      (Obrigatório) O valor padrão é soco -facebook. Não editar.

    • Configuração de Cloud Service

      O valor padrão é /etc/ cloudservices / facebookconnect. Não editar.

    • Configuração de Serviço do Provedor OAuth

      O valor padrão é /apps/social/facebookprovider/config/. Não editar.

    • Habilitar Marcas

      Não editar.

    • Caminho do usuário

      Local no repositório onde os dados do usuário estão armazenados. Para um site da comunidade, para garantir permissões para que os membros visualizem o perfil um do outro, o caminho deve ser o padrão /home/users/community.

    • Habilitar campos

      Se marcados, os Campos listados serão especificados na solicitação ao Facebook para autenticação e informações do usuário. O padrão é desmarcado.

    • Campos

      Quando os Campos são ativados, os seguintes campos são incluídos ao chamar a API do gráfico do Facebook. Os campos devem ser permitidos dentro do escopo definido na configuração do Cloud Service. Campos adicionais podem exigir aprovação pela Facebook. Consulte a seção Permissões de logon do Facebook da documentação do Facebook. Os campos padrão adicionados como parâmetros são:

      • id
      • name
      • first_name
      • last_name
      • link
      • localidade
      • imagem
      • fuso horário
      • updated_time
      • verificado
      • email

    Se algum campo for adicionado ou alterado, atualize a configuração correspondente do Manipulador de sincronização padrão para corrigir o mapeamento.

    • Atualizar Usuário

      Se marcado, atualiza os dados do usuário no repositório em cada logon para refletir as alterações de perfil ou os dados adicionais solicitados. O padrão está desmarcado.

Próximas etapas next-steps

As próximas etapas são as mesmas para o Facebook e o Twitter:

Login do Twitter twitter-login

Criar um aplicativo do Twitter create-a-twitter-app

Um aplicativo Twitter configurado é necessário para habilitar o logon na rede social do Twitter.

Siga as instruções mais recentes para criar um aplicativo do Twitter em https://apps.twitter.com.

Em geral:

  1. Digite um Nome que identificará o aplicativo do Twitter para os usuários do site.

  2. Insira uma Descrição.

  3. Para site - digite https://<server>.

  4. Para URL de Retorno de Chamada - digite https://server.

    note note
    NOTE
    Não é necessário especificar a porta.
    Para desenvolvimento, https://127.0.0.1/ funcionará.
  5. Depois que o aplicativo tiver sido criado, localize a Chave do Consumidor (API) e o Segredo do Consumidor (API). Estas informações serão necessárias para configurar o serviço de nuvem do Twitter.

Permissões permissions

Na seção de permissões do gerenciamento de aplicativos do Twitter:

  • Acesso: Selecione Read only.

    • Outras opções não são suportadas
  • Permissões adicionais: como opção, escolha Request email addresses from users.

    • Se não for selecionada, o perfil do usuário no AEM não incluirá seu endereço de email.
    • as instruções do Twitter observam as etapas adicionais a serem seguidas.

A única solicitação REST feita para logon social é para conta do GET/verificar credenciais.

Criar um Cloud Service de conexão do Twitter create-a-twitter-connect-cloud-service

A instância do Provedor e Aplicativo OAuth do Adobe Granite, instanciada pela criação de uma configuração de serviço na nuvem, identifica o aplicativo do Twitter e os grupos de membros aos quais os novos usuários são adicionados.

  1. Na instância do autor, faça logon com privilégios de administrador.

  2. Na navegação global, selecione Ferramentas > Cloud Service > Configuração de logon social do Twitter.

  3. Escolha a configuração de caminho de contexto.

    O Caminho do contexto deve ser igual ao caminho de configuração da nuvem selecionado ao criar/editar um site da comunidade.

  4. Verifique se o caminho de contexto está habilitado para criar serviços de nuvem abaixo dele.

  5. Vá para Ferramentas > Geral > Navegador de Configuração. Selecione o contexto e edite as propriedades. Habilite as Configurações de nuvem se ainda não estiver habilitado.

    twitterconfigproppng

  6. Criar/editar a configuração do serviço de nuvem do Twitter.

    twittersocialloginpng

    • Título

      (Obrigatório) Insira um título de exibição que identifique o aplicativo Twitter. Use o mesmo nome inserido como Nome para Exibição para o aplicativo Twitter.

    • Chave do consumidor

      (Obrigatório) Digite a Chave do Consumidor (API) para o aplicativo Twitter. Isso identifica a instância Provedor e Aplicativo OAuth do Adobe Granite criada a partir da caixa de diálogo.

    • Segredo do consumidor

      (Obrigatório) Insira o Segredo da API do Aplicativo Twitter.

    • Criar usuários

      Se marcado, o login com uma conta do Twitter criará uma entrada de usuário AEM e a adicionará como membro ao(s) grupo(s) de usuários selecionado(s). O padrão está marcado (altamente recomendado).

    • Mascarar IDs de Usuário

      Deixe desmarcado.

    • Adicionar aos Grupos de Usuários

      Selecione Adicionar grupo de usuários para escolher um ou mais grupos de membros para o site da comunidade ao qual os usuários serão adicionados.

    note note
    NOTE
    Os grupos podem ser adicionados ou removidos a qualquer momento. Mas as associações de usuários existentes não são afetadas. A associação automática se aplica somente a novos usuários que estão sendo criados após a atualização desse campo. Para os sites em que os usuários anônimos estão desativados, adicione usuários ao grupo de membros da comunidade correspondente destinado ao site da comunidade fechado.
  7. Selecione SALVAR e Publish.

Adobe O resultado é uma instância de Provedor e Aplicativo OAuth do Granite que não requer mais modificações. O escopo padrão são as permissões padrão para logon de Twitter.

Provedor OAuth do AEM Communities Twitter aem-communities-twitter-oauth-provider

A configuração do AEM Communities estende a instância do Aplicativo e Provedordo Adobe Granite OAuth. Esse provedor exigirá edição para permitir atualizações do usuário.

Se a edição for necessária, em cada instância de publicação AEM:

  1. Faça logon com privilégios de administrador.

  2. Navegue até o Console da Web.

    Por exemplo, http://localhost:4503/system/console/configMgr.

  3. Localize o Provedor OAuth do AEM Communities Twitter.

  4. Selecione o ícone de lápis a ser aberto para edição.

    twitteroauth_png

    • ID do Provedor OAuth

    (Obrigatório) O valor padrão é soco -twitter. Não editar.

    • Configuração de Cloud Service

      O valor padrão é conf. Não editar.

    • Configuração de Serviço do Provedor OAuth

      O valor padrão é /apps/social/twitterprovider/config/. Não editar.

    • Caminho do usuário

      Local no repositório onde os dados do usuário estão armazenados. Para um site da comunidade, para garantir permissões para que os membros visualizem o perfil uns dos outros, o caminho deve ser o padrão /home/users/community.

    • Habilitar Parâmetros - não editar

    • Parâmetros de URL - não editar

    • Atualizar Usuário

      Se marcado, atualiza os dados do usuário no repositório em cada logon para refletir as alterações de perfil ou os dados adicionais solicitados. O padrão é desmarcado.

Próximas etapas next-steps-1

As próximas etapas são as mesmas para o Facebook e o Twitter:

Ativar logon social enable-social-login

Console de sites do AEM Communities aem-communities-sites-console

Depois que um serviço de nuvem é configurado, ele pode ser habilitado para a configuração relevante de Logon social de um site da comunidade usando o subpainel Configurações do Gerenciamento de usuários durante a criação ou o gerenciamento do site da comunidade.

  1. Escolha o contexto de configuração do site onde você salvou as configurações de logon social.

  2. Na guia Geral, defina as configurações de nuvem.

    managesites_png

  3. Na guia Configurações, habilite Logons sociais e Salvar.

    usermgmt_png

Testar logon social test-social-login

  • Verifique se o Manipulador de autenticação OAuth do Adobe foi habilitado em todas as instâncias de publicação.
  • Verifique se os serviços em nuvem foram publicados.
  • Verifique se o site da comunidade foi publicado.
  • Inicie o site publicado em um navegador.
    Por exemplo, http://localhost:4503/content/sites/engage/en.html
  • Selecione Login Em.
  • Selecione Entrar com o Facebook ou Entrar com o Twitter.
  • Se ainda não tiver feito logon no Facebook ou no Twitter, faça logon com as credenciais apropriadas.
  • Pode ser necessário conceder permissão dependendo da caixa de diálogo exibida pelo aplicativo Facebook ou Twitter.
  • Observe que a barra de ferramentas na parte superior da página é atualizada para refletir o logon bem-sucedido.
  • Selecionar Perfil: a página Perfil exibe a imagem de avatar, o nome e o sobrenome do usuário. Ela também exibe as informações do perfil do Facebook ou do Twitter de acordo com os campos/parâmetros permitidos.

Configurações do OAuth para a plataforma AEM aem-platform-oauth-configurations

Manipulador de autenticação OAuth do Adobe Granite adobe-granite-oauth-authentication-handler

O Adobe Granite OAuth Authentication Handler não está habilitado por padrão e deve estar habilitado em todas as instâncias de publicação AEM.

Para ativar o manipulador de autenticação na publicação, basta abrir a configuração do OSGi e salvá-la:

  • Faça logon com privilégios de administrador.
  • Navegue até o Console da Web.
    Por exemplo, http://localhost:4503/system/console/configMgr
  • Localizar Adobe Granite OAuth Authentication Handler.
  • Selecione para abrir a configuração para edição.
  • Selecione Salvar.

graniteoauth

CAUTION
Tenha cuidado para não confundir o manipulador de autenticação com uma instância Facebook ou Twitter do Provedor e Aplicativo Adobe Granite OAuth.

graniteoauth1

Aplicativo e provedor Adobe Granite OAuth adobe-granite-oauth-application-and-provider

Quando um serviço de nuvem para Facebook ou Twitter é criado, uma instância de Adobe Granite OAuth Authentication Handler é criada.

Para localizar a instância criada para um aplicativo Facebook ou Twitter:

  1. Faça logon com privilégios de administrador.

  2. Navegue até o Console da Web.

    Por exemplo, http://localhost:4503/system/console/configMgr.

  3. Localize o Aplicativo e Provedor Adobe Granite OAuth.

    • Localize a instância em que a ID do Cliente corresponde à ID do Aplicativo.

      graniteoauth2

      Com exceção das seguintes propriedades, deixe as outras propriedades da configuração inalteradas:

    • ID de configuração

      (Obrigatório) As IDs de configuração do OAuth devem ser exclusivas. Gerado automaticamente quando o serviço em nuvem é criado.

    • ID do cliente

      (Obrigatório) A ID do aplicativo fornecida quando o serviço de nuvem foi criado.

    • Segredo do cliente

      (Obrigatório) A senha do aplicativo fornecida quando o serviço de nuvem foi criado.

    • Escopo

      (Opcional) Escopo adicional para o que é permitido pode ser solicitado ao provedor. O escopo padrão abrange as permissões necessárias para fornecer autenticação social e dados de perfil.

    • ID do provedor

      (Obrigatório) A ID do provedor do AEM Communities é definida quando o serviço de nuvem é criado. Não editar. Para o Facebook Connect, o valor é soco -facebook. Para o Twitter Connect, o valor é soco -twitter.

    • Grupos

      (Recomendado) Um ou mais grupos de membros aos quais os usuários criados são adicionados. No AEM Communities, é recomendável listar o grupo de membros para o site da comunidade.

    • URL de Retorno

      (Opcional) URL configurada com os provedores OAuth para redirecionar o cliente. Use um URL relativo para usar o host da solicitação original. Deixe em branco para utilizar o URL originalmente solicitado. O sufixo "/callback/j_security_check" é anexado automaticamente a este url.

    note note
    NOTE
    O domínio para o retorno de chamada deve ser registrado com o provedor (Facebook ou Twitter).

Para cada configuração do manipulador de autenticação OAuth, há duas configurações adicionais criadas na instância:

  • Manipulador de sincronização padrão do Apache Jackrabbit Oak (org.apache.jackrabbit.oak.spi.security.authentication.external.impl.DefaultSyncHandler) - Nenhuma edição é necessária, mas você pode ver os mapeamentos de campo de usuário como os campos do Facebook são mapeados para um nó de perfil de usuário do CQ. Observe também que "Nome do manipulador de sincronização" corresponde à ID de configuração da configuração do provedor OAuth.
  • Módulo de logon externo do Apache Jackrabbit Oak (org.apache.jackrabbit.oak.spi.security.authentication.external.impl.ExternalLoginModuleFactory) - Nenhuma edição é necessária, mas você pode notar que 'Nome do provedor de identidade' e 'Nome do manipulador de sincronização' são iguais e apontam para as configurações correspondentes do OAuth e do manipulador de sincronização, respectivamente.

Para obter mais informações, consulte Autenticação com o módulo de logon externo do Apache Oak.

Desempenho de passagem de usuário do OAuth oauth-user-traversal-performance

Para sites da comunidade que veem centenas de milhares de usuários se registrarem usando o logon da Facebook ou do Twitter, o desempenho de passagem da consulta executada quando um visitante do site usa o logon social pode ser aprimorado adicionando o seguinte índice da Oak.

Se avisos de passagem forem vistos nos logs, é recomendável adicionar esse índice.

Em uma instância de autor, conectado com privilégios administrativos:

  1. Na navegação global: selecione Ferramentas, CRX/DE Lite.

  2. Crie um índice chamado ntBaseLucene-oauth a partir de uma cópia de ntBaseLucene:

    • No nó /oak:index
    • Selecionar nó ntBaseLucene
    • Selecionar Cópia
    • Selecionar /oak:index
    • Selecionar Colar
    • Renomear cópia de ntBaseLucene para ntBaseLucene-oauth
  3. Modifique as propriedades do nó ntBaseLucene-oauth:

    • indexPath: /oak:index/ntBaseLucene-oauth
    • nome: oauthid-123&#x200B;**&#x200B;**
    • reindexar: true
    • reindexCount: 1
  4. No nó /oak:index/ntBaseLucene-oauth/indexRules/nt:base/properties:

    • Exclua todos os nós filhos, exceto cqTags.

    • Renomear cqTags para oauthid-123**&#x200B;**

    • Modificar as propriedades do nó oauthid-123**&#x200B;**

      • nome: oauthid-123&#x200B;**&#x200B;**
    • Selecione Salvar tudo.

Para obter informações e ferramentas adicionais, consulte Consultas e indexação do Oak.

Configuração do Dispatcher dispatcher-configuration

Consulte Configuração do Dispatcher para comunidades.

recommendation-more-help
81e2cd9d-0789-409d-b87c-2a8ce4f28791