Creación de Conexión Personalizada con Discord en Auth0

Clase 7 de 28Curso de Auth0: Implementación de Autenticación y Seguridad Web

Contenido del curso

Resumen

Crear una conexión social personalizada en Auth0 es más accesible de lo que parece, y Discord es un excelente caso práctico para entender el proceso completo. Aunque Auth0 ya ofrece una integración nativa con Discord, construir una conexión custom permite comprender a fondo cómo funcionan los flujos de OAuth y cómo se configura cada pieza del rompecabezas: desde los endpoints de autorización hasta el fetch del perfil del usuario.

¿Cómo se crea una conexión custom en Auth0?

Desde el dashboard de Auth0, en la sección Authentication > Social, se puede crear una nueva conexión [0:13]. La opción clave está al final de la lista: Create Custom. A diferencia de las conexiones predefinidas, una conexión custom requiere datos adicionales:

  • Un nombre único para la conexión (no puede repetir nombres existentes como "discord").
  • Un authorization URL: el endpoint donde se inicia el flujo de autorización.
  • Un token URL: el endpoint donde se intercambia el código por un access token.
  • Los scopes: los permisos que se solicitan al servicio.
  • El client ID y el client secret de la aplicación registrada en el proveedor.

El authorization URL y el token URL son conceptos fundamentales del protocolo OAuth. Quienes hayan estudiado OAuth y OpenID Connect reconocerán estos endpoints como las piezas centrales del flujo de autorización [2:20].

¿Dónde se obtienen las credenciales del portal de Discord?

En el portal de desarrolladores de Discord (discord.com/developers), se crea una nueva aplicación [1:22]. Es importante no confundir el Application ID o el Public Key con las credenciales correctas. Las que se necesitan están en la sección OAuth2:

  • El client ID.
  • El client secret (requiere autenticación adicional por seguridad).

Para los endpoints, la documentación de Discord en su sección de OAuth proporciona tanto el authorization URL como el token URL [2:05]. Respecto a los scopes, Discord utiliza identify y email para acceder al perfil del usuario [3:05]. Cada servicio define sus propios scopes en su documentación.

¿Cómo se construye el script de fetch del perfil?

Auth0 necesita saber cómo obtener los datos del usuario una vez que tiene el access token. Para esto se escribe una función llamada fetchDiscordUser que recibe tres parámetros: el access token, el contexto y un callback [3:30].

¿Qué endpoints consume el script?

Se definen dos constantes principales:

  • api_url: apunta a discord.com/api/v10 (verificar siempre la versión vigente de la API).
  • cdnUrl: apunta a cdn.discordapp.com, necesario para construir la URL del avatar.

El método request.get consume el endpoint /users/@me enviando un header de tipo Bearer con el access token [4:15]. Este patrón de autorización mediante bearer token es estándar en los flujos de OAuth.

¿Cómo se construye el perfil del usuario?

Si la respuesta es exitosa (código 200), se parsea el JSON y se extraen los atributos: id, username, discriminator y avatar [5:05]. Con estos datos se construye:

  • El tag: combinación de username y discriminator (el número que Discord asigna a cada usuario).
  • El picture: concatenación del CDN con la ruta /avatars/id-avatar.png.
  • El profile: objeto con id, name (tag), nickname (username) y picture.

El callback se invoca con null como primer parámetro (sin error) y el perfil como segundo. Si ocurre un error de parseo, se retorna el callback con el error correspondiente [5:55].

¿Qué configuración adicional necesita Discord?

Una vez pegado el script en Auth0 y activada la conexión para la aplicación, es posible probar la conexión antes de llevarla a producción [6:30]. Un error común es olvidar configurar la URL de redirección en el portal de Discord. Esta URL sigue el formato tudominio.auth0.com/login/callback [6:52].

Tras agregar la URL de redirección y guardar los cambios, la conexión funciona correctamente. Al hacer logout y volver a iniciar sesión, la opción personalizada aparece disponible en el formulario de autenticación [7:15].

La lección central es clara: Auth0 permite implementar cualquier conexión social personalizada siempre que el servicio utilice OAuth como método de autorización. El reto propuesto es buscar cualquier otro servicio con OAuth e implementarlo como custom social en Auth0.