Autenticação única (SSO) do Auth0 | Faça login no WordPress usando o Auth0

Visão geral

O plugin OAuth SSO para WordPress permite o login seguro no WordPress usando o Auth0 como provedor OAuth e OpenID Connect. Você também pode configurar o plugin usando diferentes provedores personalizados e IdPs padrão. Ele oferece suporte a recursos avançados de Single Sign-On (SSO), como mapeamento de atributos de perfil de usuário, mapeamento de funções, etc. Aqui, vamos apresentar um guia para configurar o SSO entre o WordPress e o Auth0. Ao final deste guia, Os usuários devem conseguir fazer login no Auth0 com o Single Sign-On OAuth no WordPress. clique aqui.

Pré-requisitos: Download e instalação

• Efetue login na sua instância do WordPress como administrador.
• Ir para o WordPress Painel -> Plugins e clique em adicionar Novo.
• Procurar por um Autenticação única OAuth (SSO) plugin para WordPress e clique em Agora instale.
• Uma vez instalado, clique em Ativação.

Etapas de configuração

Etapa 1: configurar o Auth0 como provedor OAuth

• Acesse https://auth0.com/auth/login e inscreva-se ou faça login.
• Acesse Aplicações guia no painel esquerdo e clique em Aplicações.

• clique em Criar aplicativo para criar um novo aplicativo.

• Selecionar Aplicações web regulares e clique em Criar botão.

• Agora vá para Configurações aba.

• Role para baixo até URIs de aplicativos seção e entrar no URL de retorno de chamada que você obterá do plugin. Em seguida, role para baixo e clique em "Salvar alterações".

• Copie o ID do cliente e Segredo do cliente a partir das informações básicas na aba de configurações e salve-as na configuração do plugin miniOrange OAuth Client.

• Agora vá para Utilizadores guia no gerenciamento de usuários no painel esquerdo.

• Clique em Criar Usuário para criar um novo usuário.

• Insira todos os detalhes necessários e clique em Criar.




Você configurou com sucesso Aut0 como Provedor OAuth para obter login Auth0 SSO no seu site WordPress.

Etapa 2: configurar o WordPress como cliente OAuth

• Gratuito
• Premium

• Acesse Configurar OAuth guia e clique Adicionar novo aplicativo para adicionar um novo aplicativo cliente ao seu site.

• Escolha seu aplicativo na lista de provedores OAuth / OpenID Connect, aqui Aut0

• Após selecionar o provedor copie o URL de retorno de chamada que precisa ser configurado na configuração do aplicativo SSO do provedor OAuth.
• Insira as credenciais do cliente como ID do cliente & Segredo do cliente que você obterá do aplicativo Auth0 SSO.
• configurar Nome de domínio encontrado no aplicativo Auth0 SSO. Consulte a tabela abaixo para configurar o escopo e pontos finais para Auth0 no plugin.

Observação: Depois de criar a conta Auth0, você encontrará o URL de domínio e você precisará adicionar o mesmo nos pontos finais abaixo.




Escopo:	e-mail do perfil OpenID
Autorizar ponto final:	https://<Auth0-app-domain>/authorize
Ponto final do token de acesso:	https://<Auth0-app-domain>/oauth/token
Obter informações do usuário Endpoint:	https://<Auth0-app-domain>/userinfo



• Clique em Seguinte.
• Depois de verificar todos os detalhes na página de resumo, clique em Concluir para salvar a configuração e testar a conexão SSO.




Você configurou com sucesso WordPress como cliente OAuth para obter login Auth0 no seu site WordPress.

• Acesse Configurar OAuth guia e pesquise o nome do seu aplicativo para adicionar um novo aplicativo cliente ao seu site, aqui Aut0.

• configurar Nome do aplicativo, ID do cliente, Segredo do cliente do aplicativo Auth0 SSO.

• Consulte a tabela abaixo para configurar o escopo e endpoints para Auth0 no plugin.

  Observação: Depois de criar a conta Auth0, você encontrará o URL do domínio e você precisará adicionar o mesmo nos pontos finais abaixo.

  
  

  Escopo:	perfil openid
  Autorizar ponto final:	https://{your-auth0-domain}/authorize
  Ponto final do token de acesso:	https://{your-auth0-domain}/oauth/token

  
• Escolha o seu Tipo de concessão da lista de opções e clique em Salvar configurações para salvar a configuração.




Você configurou com sucesso WordPress como cliente OAuth para obter login Auth0 no seu site WordPress.

Etapa 3: Mapeamento de atributos do usuário

• O Mapeamento de Atributos do Usuário é obrigatório para permitir que os usuários façam login no WordPress com sucesso. Configuraremos os atributos do perfil de usuário para o WordPress usando as configurações abaixo.

Encontrando atributos do usuário:

• Acesse Configurar OAuth aba. Role para baixo e clique em Configuração de Teste.

• Você verá todos os valores retornados pelo seu Provedor OAuth para o WordPress em uma tabela. Caso não encontre valores para Nome, Sobrenome, E-mail ou Nome de usuário, faça as configurações necessárias no seu Provedor OAuth para retornar essas informações.
• Depois de ver todos os valores na Configuração de Teste, vá para Mapeamento de Atributos/Funções guia, você obterá a lista de atributos em um menu suspenso Nome de usuário.

Etapa 4: Mapeamento de funções [Premium]

• Clique em “Configuração de teste” e você obterá a lista de Nomes de Atributos e Valores de Atributos que são enviados pelo seu provedor OAuth.
• Na janela "Configuração de Teste", mapeie os Nomes de Atributos na seção "Mapeamento de Atributos" do plugin. Consulte a captura de tela para mais detalhes.

• Habilitar mapeamento de funções: Para habilitar o Mapeamento de Funções, você precisa mapear o Atributo de Nome do Grupo. Selecione o nome do atributo na lista de atributos que retorna as funções do seu aplicativo provedor.
  Ex.: Função


• Atribuir função do WordPress à função do Provedor: Com base na sua aplicação de provedor, você pode alocar a função WordPress às ​​suas funções de provedor. Pode ser aluno, professor, administrador ou qualquer outro, dependendo da sua aplicação. Adicione as funções de provedor em "Valor do Atributo de Grupo" e atribua a função WordPress necessária antes delas em "Função WordPress".
  
  Por exemplo, na imagem abaixo. O professor recebeu a função de Administrador e o aluno, a função de Assinante.

• Após salvar o mapeamento, a função de provedor será atribuída ao SSO do WordPress.
  Exemplo: Conforme o exemplo fornecido, usuários com a função "professor" serão adicionados como administradores no WordPress e "aluno" será adicionado como assinantes.

Etapa 5: criar atributos personalizados no Auth0

• Adicionar atributos personalizados com um valor de atributo comum
• Adicionar atributos personalizados específicos do usuário com valores de atributos diferentes

• Acesse https://auth0.com/auth/login para efetuar login na sua conta de desenvolvedor Auth.
• No painel esquerdo, vá para Ação -> Fluxos -> Login.

• Clique em Adicionar ação -> Criar personalizado.

• Digite o nome desejado e mantenha as demais configurações como estão. Clique em Criar botão.

• Escreva o código abaixo no editor de código. Após escrever o código, clique em Implementar.

      
                
                Code:
                  exports.onExecutePostLogin = async (event, api) => {
                  const attr_name = "favorite_color";
                  api.idToken.setCustomClaim( attr_name , 'Purple');
                          
                  // ... additional code
                  };
                          
                Code Description:
                          
                  attr_name: This will be the attribute name which will you want to create (favorite_color in my case)
                          
                  The function api.idToken.setCustomClaim(), expects the key and its value. Here, the key is attr_name, and its value is “Purple”
                
                


• Após clicar em Implantar, volte para Ação -> Fluxos -> Login -> Personalizado & Arraste e solte a ação que criamos (Adicionar atributos personalizados) entre o fluxo Iniciar e Concluir, conforme mostrado abaixo:

• Depois de fazer isso, clique em Inscreva-se botão.
• Por fim, execute a Configuração de Teste no plugin miniOrange OAuth Single Sign-On para ver o atributo personalizado do usuário, conforme mostrado abaixo:

• Acesse https://auth0.com/auth/login para efetuar login na sua conta de desenvolvedor Auth.
• No painel esquerdo, vá para Gerenciamento de Usuários -> Usuários.
• Selecione o usuário ao qual você deseja atribuir o atributo personalizado.

• Após selecionar um usuário, role para baixo e vá para Metadados. Em metadados do usuário, você precisará adicionar os atributos personalizados como um par chave-valor, conforme mostrado abaixo:

• No painel esquerdo, vá para Ação -> Fluxos -> Login.

• Clique em Adicionar ação -> Criar personalizado.

• Digite o nome desejado e mantenha as demais configurações como estão. Clique em Criar botão.

• Escreva o código abaixo no editor de código. Após escrever o código, clique em Implementar.

              

              Code:
                exports.onExecutePostLogin = async (event, api) => {
                          
                const { favorite_color, preferred_contact } = event.user.user_metadata;
                        
                if (event.authorization) {
                // Set claims 
                api.idToken.setCustomClaim('fav_color', favorite_color);
                api.idToken.setCustomClaim('preferred_contact', preferred_contact);
                }
                };
                        
                        
              Code Description:
                We’ll add the keys (created in user_metadata) in the const as the parameters.
                        
                When using the "api.idToken.setCustomClaim() function, you will need to include two parameters. The first parameter is used to specify the desired attribute name, while in the second parameter you will add the key which you want set the attribute value.
              
              


• Após clicar em Implantar, volte para Ação -> Fluxos -> Login -> Personalizado & Arraste e solte a ação que criamos anteriormente (Adicionar Atributos Personalizados) entre o fluxo Iniciar e Concluir, conforme mostrado abaixo:

• Depois de fazer isso, clique em Inscreva-se botão.
• Por fim, execute a Configuração de Teste no plugin miniOrange para ver o atributo personalizado do usuário, conforme mostrado abaixo:

Etapa 6: Configurações de login

• Configurações de login para WordPress 5.7 e anteriores
• Configurações de login para WordPress 5.8
• Configurações de login para WordPress 5.9

• Acesse Painel esquerdo do WordPress > Aparências > Widgets.
• Selecionar miniOrange OAuth. Arraste e solte no seu local favorito e salve.

• Acesse Painel esquerdo do WordPress > Aparências > Widgets.
• Selecionar miniOrange OAuth. Arraste e solte no seu local favorito e salve.

• Abra sua conta Auth0 SSO para Auth0 Single Sign-On para WordPress (SSO) - Auth0 OAuth agora mesmo.

• Verifique se o "Mostrar na página de login" a opção está habilitada para seu aplicativo. (Consulte a imagem abaixo)

• Agora vá ao seu Faça login no WordPress Disputas de Comerciais. (Ex.: https://< seu-dominio-wordpress >/wp-login.php)
• Você verá um botão de login Auth0 SSO. Após clicar no botão, você poderá testar o Auth0 Single Sign-On (SSO) - Auth0 OAuth.

Artigos Relacionados

• Estrutura de autorização OAuth 2.0
• O que é OAuth 2.0?
• OAuth / OpenID Connect / SSO JWT para WordPress
• O que é OAuth 2.0 e como ele funciona?
• Como somos diferentes