Inicio de sesión único (SSO) de Auth0 | Iniciar sesión en WordPress usando Auth0

Resumen

El plugin OAuth SSO para WordPress permite un inicio de sesión seguro en WordPress utilizando Auth0 como proveedor de OAuth y OpenID Connect. También puede configurar el plugin utilizando diferentes proveedores personalizados y proveedores de identidad estándar. Admite funciones avanzadas de inicio de sesión único (SSO), como la asignación de atributos de perfil de usuario, la asignación de roles, etc. Aquí veremos una guía para configurar SSO entre WordPress y Auth0. Al final de esta guía, Los usuarios deberían poder iniciar sesión en Auth0 con OAuth Single Sign-On en WordPress, puedes haz clic aquí..

Descargar Plugin

Planes de Precios

Prueba Gratuita

Requisitos previos: descarga e instalación

Inicie sesión en su instancia de WordPress como administrador.
Ir a WordPress Panel de control -> Complementos y haga clic en Añadir nuevo.
Buscar un Inicio de sesión único (SSO) de OAuth complemento para WordPress y haga clic en Instalar ahora .
Una vez instalado, haga clic en Activa.

Pasos de configuración

Paso 1: Configurar Auth0 como proveedor OAuth

Vaya al https://auth0.com/auth/login y regístrate o inicia sesión.
Vaya al Aplicaciones pestaña en el panel izquierdo y luego haga clic en Aplicaciones.

OAuth/OpenID/OIDC Inicio de sesión único (SSO), Inicio de sesión SSO Auth0 para ir a aplicaciones

hacer clic en Crear aplicación para crear una nueva aplicación.

OAuth/OpenID/OIDC Inicio de sesión único (SSO),Auth0 SSO Iniciar sesión crear aplicación

Seleccionar Aplicaciones web habituales y haga clic en Crear .

Inicio de sesión único (SSO) de OAuth/OpenID/OIDC, inicio de sesión SSO de Auth0, seleccione la aplicación web normal

Ahora ve a .

OAuth/OpenID/OIDC Inicio de sesión único (SSO), Inicio de sesión SSO Auth0, vaya a la configuración

Desplácese hacia abajo hasta URI de aplicaciones sección e ingrese el URL de devolución de llamada que obtendrás del complemento. Luego, desplázate hacia abajo y haz clic en Guardar cambios.

OAuth/OpenID/OIDC Inicio de sesión único (SSO), URL de devolución de llamada de inicio de sesión SSO Auth0

Copia el ID de cliente y Secreto del cliente desde la información básica en la pestaña de configuración y guárdela en la configuración del complemento miniOrange OAuth Client.

OAuth/OpenID/OIDC Inicio de sesión único (SSO), credenciales de cliente de inicio de sesión SSO Auth0

Ahora ve a Usuarios pestaña en la gestión de usuarios desde el panel izquierdo.

OAuth/OpenID/OIDC Inicio de sesión único (SSO), inicio de sesión SSO Auth0 ir al usuario

Haga clic en crear usuario para crear un nuevo usuario.

OAuth/OpenID/OIDC Inicio de sesión único (SSO), inicio de sesión SSO Auth0 crear usuario

Ingrese todos los datos requeridos y haga clic en Crear.

OAuth/OpenID/OIDC Inicio de sesión único (SSO), inicio de sesión SSO Auth0 completa el requisito de usuario

Has configurado correctamente Autor0 como proveedor de OAuth para lograr el inicio de sesión SSO Auth0 en su sitio de WordPress.

Paso 2: configurar WordPress como cliente OAuth

Free
Premium

Vaya al Configurar OAuth y haga clic en Agregar nueva aplicación para agregar una nueva aplicación cliente a su sitio web.

Auth0 Inicio de sesión único (SSO) - Auth0 OAuth OAuth - Agregar nueva aplicación

Elija su aplicación de la lista de proveedores de OAuth/OpenID Connect, aquí Autor0

Inicio de sesión único (SSO) Auth0 - Auth0 OAuth OAuth - Seleccionar aplicación

Después de seleccionar el proveedor copie el URL de devolución de llamada que debe configurarse en la configuración de la aplicación SSO del proveedor de OAuth.
Ingrese las credenciales del cliente como ID de cliente & Secreto del cliente que obtendrá de la aplicación Auth0 SSO.
Configurar Nombre de dominio encontrado en la aplicación Auth0 SSO. Consulte la siguiente tabla para configurar el alcance y puntos finales para Auth0 en el complemento.

Nota: Una vez que cree la cuenta Auth0, encontrará el URL del dominio y deberá agregar lo mismo en los puntos finales siguientes.

Alcance:	correo electrónico de perfil openid
Autorizar punto final:	https://<Auth0-app-domain>/authorize
Punto final del token de acceso:	https://<Auth0-app-domain>/oauth/token
Obtener punto final de información del usuario:	https://<Auth0-app-domain>/userinfo

Auth0 Inicio de sesión único (SSO) - Auth0 OAuth OAuth - agregar credenciales de cliente

Haga clic en Siguiente.
Después de verificar todos los detalles en la página de resumen, haga clic en Finalizar para guardar la configuración y probar la conexión SSO.

Inicio de sesión único (SSO) Auth0: finalizar la configuración

Has configurado correctamente WordPress como cliente OAuth para lograr el inicio de sesión de Auth0 en su sitio de WordPress.

Vaya al Configurar OAuth y busque el nombre de su aplicación para agregar una nueva aplicación cliente a su sitio web, aquí Autor0.

Configurar Nombre de la aplicación, ID del cliente, secreto del cliente desde la aplicación Auth0 SSO.

Consulte la siguiente tabla para configurar el alcance y puntos finales para Auth0 en el complemento.

Nota: Una vez que cree la cuenta Auth0, encontrará el URL del dominio y deberá agregar lo mismo en los puntos finales siguientes.

Alcance:	perfil abierto
Autorizar punto final:	https://{your-auth0-domain}/authorize
Punto final del token de acceso:	https://{your-auth0-domain}/oauth/token

Auth0 Inicio de sesión único (SSO) - Auth0 OAuth OAuth - Agregar nombre de aplicación, TenantID

Escoge tu Tipo de beca de la lista de opciones y haga clic en Guardar configuración para guardar la configuración.

Inicio de sesión único (SSO) Auth0 - Auth0 OAuth OAuth - Agregar tipo de concesión

Has configurado correctamente WordPress como cliente OAuth para lograr el inicio de sesión Auth0 en su sitio de WordPress.

Paso 3: Mapeo de atributos de usuario

La asignación de atributos de usuario es obligatoria para permitir a los usuarios iniciar sesión correctamente en WordPress. Configuraremos los atributos del perfil de usuario para WordPress usando la siguiente configuración.

Encontrar atributos de usuario:

Vaya al Configurar OAuth pestaña. Desplácese hacia abajo y haga clic en Configuración de prueba.

Inicio de sesión único (SSO) de Auth0 - Auth0 OAuth - configuración de prueba

Verá todos los valores devueltos por su proveedor de OAuth a WordPress en una tabla. Si no ve el valor de Nombre, Apellido, Correo electrónico o Nombre de usuario, realice las configuraciones necesarias en su proveedor de OAuth para devolver esta información.
Una vez que vea todos los valores en Configuración de prueba, vaya a Mapeo de atributos/roles pestaña, obtendrá la lista de atributos en un menú desplegable de Nombre de usuario.

Inicio de sesión único (SSO) de Auth0 - Auth0 OAuth - asignación de atributos/rol

Paso 4: Asignación de roles [Premium]

Haga clic en “Configuración de prueba” y obtendrá la lista de nombres de atributos y valores de atributos enviados por su proveedor de OAuth.
Desde la ventana Configuración de prueba, asigne los nombres de atributos en la sección Asignación de atributos del complemento. Consulte la captura de pantalla para obtener más detalles.

SSO del complemento del cliente WordPress OAuth: mapeo de atributos

Habilitar asignación de roles: Para habilitar la asignación de roles, debe asignar el atributo de nombre de grupo. Seleccione el nombre del atributo de la lista de atributos que devuelve los roles de su aplicación de proveedor.
Por ejemplo: rol

SSO del complemento del cliente WordPress OAuth: configuración de prueba - mapeo de roles

Asigne el rol de WordPress al rol de Proveedor: Según su aplicación de proveedor, puede asignar la función de WordPress a sus funciones de proveedor. Puede ser estudiante, profesor, administrador o cualquier otro dependiendo de su aplicación. Agregue los roles de proveedor en Valor de atributo de grupo y asigne el rol de WordPress requerido delante de él en Rol de WordPress.

Por ejemplo, , en la imagen de abajo. Al maestro se le ha asignado el rol de administrador y al estudiante el rol de suscriptor.

Una vez que guarde la asignación, se le asignará al rol de proveedor el inicio de sesión único (SSO) para WordPress.
Ejemplo: Según el ejemplo dado, los usuarios con el rol de "profesor" se agregarán como administradores en WordPress y el "estudiante" se agregará como suscriptor.

Paso 5: Crea atributos personalizados en Auth0

Agregar atributos personalizados con un valor de atributo común
Agregue atributos personalizados específicos del usuario con diferentes valores de atributos

Vaya al https://auth0.com/auth/login para iniciar sesión en su cuenta de desarrollador de autenticación.
En el panel izquierdo, vaya a Acción -> Flujos -> Iniciar sesión.

Haga clic en Agregar acción -> Crear personalizado.

Ingrese el nombre que desee y mantenga las otras configuraciones como están. Haga clic en Crear .

Escriba el siguiente código en el editor de código. Después de escribir el código, haga clic en Despliegue.

      
                
                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”

Después de hacer clic en Implementar, regrese a Acción -> Flujos -> Iniciar sesión -> Personalizado & Arrastre y suelte la acción que creamos (Agregar atributos personalizados) entre el flujo Iniciar y Completar, como se muestra a continuación:

Después de hacer esto, haga clic en Aplicar .
Finalmente, realice la configuración de prueba en el complemento miniOrange OAuth Single Sign-On para ver el atributo personalizado del usuario, como se muestra a continuación:

Vaya al https://auth0.com/auth/login para iniciar sesión en su cuenta de desarrollador de autenticación.
En el panel izquierdo, vaya a Gestión de usuarios -> Usuarios.
Seleccione el usuario al que desea asignar el atributo personalizado.

Después de seleccionar un usuario, desplácese hacia abajo y vaya a Metadatos. En metadatos_usuario, deberá agregar los atributos personalizados como un par clave-valor como se muestra a continuación:

En el panel izquierdo, vaya a Acción -> Flujos -> Iniciar sesión.

Haga clic en Agregar acción -> Crear personalizado.

Ingrese el nombre que desee y mantenga las otras configuraciones como están. Haga clic en Crear .

Escriba el siguiente código en el editor de código. Después de escribir el código, haga clic en Despliegue.

              

              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.

Después de hacer clic en Implementar, regrese a Acción -> Flujos -> Iniciar sesión -> Personalizado & Arrastrar y soltar la acción que creamos anteriormente (Agregar atributos personalizados) entre el flujo Iniciar y Completar, como se muestra a continuación:

Después de hacer esto, haga clic en Aplicar .
Finalmente, realice la Configuración de prueba en el complemento miniOrange para ver el atributo personalizado del usuario, como se muestra a continuación:

Paso 6: Configuración de inicio de sesión

Configuración de inicio de sesión para WordPress 5.7 y anteriores
Configuración de inicio de sesión para WordPress 5.8
Configuración de inicio de sesión para WordPress 5.9

Vaya al Panel izquierdo de WordPress > Apariencias > Widgets.
Seleccionar miniOrange OAuth. Arrastra y suelta en tu ubicación favorita y guarda.

Auth0 Single Sign-on (SSO): configuración del botón de inicio de sesión para crear un nuevo cliente en WordPress

Vaya al Panel izquierdo de WordPress > Apariencias > Widgets.
Seleccionar miniOrange OAuth. Arrastra y suelta en tu ubicación favorita y guarda.

Abra su Auth0 SSO para Auth0 Single Sign-On para WordPress (SSO) - Auth0 OAuth ahora.

Asegúrese de que "Mostrar en la página de inicio de sesión" La opción está habilitada para su aplicación. (Consulte la imagen a continuación)

Auth0 Single Sign-on (SSO) - Auth0 OAuth - Configuración del botón de inicio de sesión para crear un nuevo cliente en WordPress

Ahora ve a tu Iniciar sesión en WordPress Desbobinador hidráulico de alta resistencia:Para bobinas de mayor peso o necesidades de automatización más elevadas, visite ladesbobinador hidráulico de alta resistencia. (Por ejemplo, https://<su-dominio-wordpress>/wp-login.php)
Allí verás un botón de inicio de sesión SSO de Auth0. Una vez que hagas clic en el botón de inicio de sesión, podrás probar el inicio de sesión único (SSO) de Auth0: Auth0 OAuth.

Contenido