Comprender Redirect URI y el Flujo de Código de Autorización en OpenID Connect (OIDC)

¿Qué es un Redirect URI?#

Un Redirect URI, también conocido como URL de respuesta, es un componente crítico de seguridad en el proceso de autenticación OIDC. Especifica la URL a la que los usuarios son enviados después de iniciar sesión exitosamente a través de un proveedor OIDC. Más importante aún, es donde tu aplicación recibe el código de autorización necesario para obtener tokens.

Consulta el Auth Wiki > Redirect URI para más detalles.

¿Qué es el Flujo de Código de Autorización?#

El Flujo de Código de Autorización (definido en OAuth 2.0 RFC 6749, sección 4.1) es un método fundamental de autenticación en OIDC. Involucra el intercambio de un código de autorización por un token de acceso y, opcionalmente, un token de actualización. Este flujo es adecuado para aplicaciones que pueden mantener de manera segura un secreto de cliente, como aplicaciones web del lado del servidor.

Consulta el Auth Wiki > Authorization Code Flow para más detalles.

¿Cómo funciona el Redirect URI en el Flujo de Código de Autorización?#

En el Flujo de Código de Autorización, el Redirect URI es el destino al que el proveedor OIDC envía el código de autorización después de que el usuario se autentica con éxito. Debe estar pre-registrado con el proveedor OIDC para garantizar la seguridad y prevenir redirecciones no autorizadas.

Aquí te mostramos cómo puedes registrar un Redirect URI en Logto Console:

Al iniciar un inicio de sesión:

1. Solicitud de autorización: Tu aplicación dirige al usuario al punto de autorización del proveedor OIDC, incluyendo parámetros como client_id, response_type, scope y el redirect_uri.
2. Autenticación de usuario: El usuario se autentica con el proveedor OIDC.
3. Entrega del código de autorización: Tras la autenticación exitosa, el proveedor OIDC redirige al usuario al redirect_uri especificado, incluyendo un código de autorización como parámetro de consulta.

El proveedor OIDC valida el redirect_uri contra la lista de URIs pre-registrados. Si hay una discordancia, se devolverá un error invalid_redirect_uri, mejorando la seguridad al prevenir que endpoints no autorizados reciban tokens.

Mejores prácticas para Redirect URIs#

En casos de uso reales, una práctica común es declarar una página "Callback" dedicada y asociar un enrutador / enlace profundo que permita el acceso directo desde el exterior. Este enlace debería ser usado como el redirect URI.

Asumiendo que tienes una aplicación web de una sola página que se ejecuta en https://my-app.com, entonces usualmente el redirect URI se declararía como https://my-app.com/callback

O si es una aplicación móvil nativa, entonces el redirect URI usualmente comienza con un esquema personalizado, por ejemplo com.company://myapp/callback

Otras mejores prácticas incluyen:

• Evitar comodines: No uses patrones de comodines en redirect URIs. Lista todos los URIs permitidos explícitamente para prevenir acceso no autorizado.
• Coincidir exactamente: Asegúrate de que el redirect URI coincida exactamente con el registrado en el proveedor OIDC. Incluso una barra al final puede causar una discordancia.

Manejar el callback de inicio de sesión#

Para manejar el código de autorización devuelto a tu redirect_uri, sigue estos pasos:

1. Extraer el código de autorización: Recupera el parámetro de código de la cadena de consulta del redirect URI.

2. Intercambiar el código de autorización por tokens: Componer una solicitud POST al punto de token del proveedor OIDC, incluyendo:

   • client_id: El ID de tu aplicación en el proveedor OIDC
   • code: El código de autorización recibido del redirect URI
   • code_verifier: Una cadena aleatoria generada en el cliente
   • redirect_uri: El mismo URI usado en la solicitud de autorización
   • grant_type: El tipo de concesión, generalmente authorization_code

Ejemplo de solicitud de intercambio de token en JavaScript#

Simplificar el proceso de intercambio de código en Logto utilizando los Logto SDKs#

Los Logto SDKs son el kit de desarrollo escrito en un lenguaje de programación o marco específico, por ejemplo Logto React SDK, Next.js SDK y Swift SDK. Usar un SDK puede simplificar mucho las cosas simplemente llamando a una o dos funciones.

Aquí tienes un ejemplo de componente "Callback" en React usando el Logto React SDK oficial:

Las guías de integración de SDK se pueden encontrar en los Docs de Logto > Quick-starts.

Resumen: por qué es importante dominar los Redirect URIs en OIDC#

Entender los Redirect URIs en OIDC con el flujo de código de autorización es crucial para asegurar y optimizar tus procesos de autenticación. Registrando URIs de redirección confiables y manejando eficazmente los callbacks de inicio de sesión, puedes asegurar una experiencia fluida y segura para tus usuarios mientras simplificas tus esfuerzos de desarrollo con los Logto SDKs.