Cómo bailar el OAuth: una lección paso a paso

¡Cinco seis SIETE OCHO!

La mayoría de las veces trato de aprender algo nuevo y ponerlo en práctica, rápidamente empiezo a sentir que estoy perdido en una gran cantidad de movimientos de baile. Estoy tratando desesperadamente de encontrar la manera correcta de hacer las cosas, sin comprender realmente qué está pasando o cómo terminé en el lado equivocado de la habitación ...

Simplemente probando cosas hasta que algo funcione.

Tal vez sea por la forma en que funciona mi proceso de aprendizaje, o tal vez las guías y tutoriales estén dirigidos a personas más experimentadas o técnicas. Pero, después de terminar de entender el tema, siempre siento que debería haber una guía fácil para comprender los conceptos clave y facilitar su aplicación en un proyecto.

Así que esta vez, he decidido dejar de desearlo y hacerlo yo mismo, usando lo último que aprendí.

Y esa cosa era OAuth 2.0.

¿Qué es el OAuth?

Comencemos con lo básico: OAuth significa Autorización abierta. Es un proceso a través del cual una aplicación o sitio web puede acceder a datos privados de usuarios desde otro sitio web.

Este otro sitio web generalmente funciona solo como un proveedor de identidad confiable. Le da a la aplicación solicitante información básica sobre usted para que la aplicación pueda crear un perfil. De esta manera, no tiene que completar un formulario de registro aburrido y tratar con otra contraseña más

Ya has usado esto al menos un millón de veces, de hecho, lo usaste cada vez que hiciste clic en "Iniciar sesión con Facebook / Google / GitHub / ...". A continuación, se le mostró una pantalla de consentimiento que mostraba qué información de su (digamos) perfil de Facebook le está permitiendo a that-hot-new-app.com leer (y, a veces, escribir). Después de eso, dado que that-hot-new-app.com confía en la identidad proporcionada por Facebook, pueden crear un perfil para usted en su base de datos utilizando los datos que recibieron.

La comunicación entre that-hot-new-app.com y Facebook generalmente termina aquí. Es por eso que su foto de perfil no cambiará en todo Internet si la cambia en Facebook. Simplemente nunca vuelven a Facebook y solicitan datos actualizados.

Cuando los ritmos de marimba comienzan a sonar ...

Hay otro propósito para construir este tipo de mecanismo, uno con mucho más potencial: usar el proveedor de identidad como proveedor de servicios (de manera continua). Esto significa comunicarse con él regularmente para proporcionar funciones mejoradas para sus usuarios.

Un buen ejemplo de esto es Relive, un servicio que se conecta con diferentes aplicaciones de rastreo de deportes para crear videos de la Tierra de su carrera o paseo. Cada vez que finaliza una actividad, Relive le solicita que ofrezca crear un video a partir de ella. Si dice que sí, lo procesarán y le notificarán cuando esté listo para alardear en las redes sociales ... Me refiero a compartir

Realmente no hay diferencia técnica entre estos dos usos. Es por eso que debe ser cauteloso acerca de dónde inicia sesión con sus redes sociales o su cuenta de Google / Gmail.

Puede sonar aterrador, pero realmente no hay nada que temer. Solo tenga en cuenta que está autorizando a that-hot-new-app.com a acceder a la información sobre usted que se detalla en la pantalla de consentimiento, potencialmente de forma recurrente. Tenga en cuenta los permisos que otorga y asegúrese de saber cómo deshabilitarlos cuando ya no se sienta confiado.

Por ejemplo, si está utilizando su cuenta de Google para acceder a that-hot-new-app.com pero ya no desea permitir eso, simplemente vaya a la configuración de su cuenta de Google y desactive su acceso.

Todos los principales proveedores de identidad ofrecen control sobre esto.

Está bien, pero ¿cómo bailas el OAuth?

Antes de aterrizar en that-hot-new-app.com e incluso hacer clic en "Iniciar sesión con YourFavoriteIdentityProvider", alguien, probablemente un desarrollador, tiene que crear una aplicación en el sitio del proveedor.

Esta es una forma de registrar that-hot-new-app.com para que, más tarde, el proveedor sepa quién está solicitando datos privados.

En este paso, el desarrollador configurará cierta información sobre la aplicación, como el nombre de la aplicación o el sitio web y, lo más importante, un URI de redireccionamiento. El proveedor (como Google o Facebook) usará esto para contactar a la aplicación solicitante y decirles que el usuario dijo que sí

Te prometo que no tendrás que escribirlo a mano, nos enorgullecemos de nuestra ausencia de papel.

Una vez que la aplicación está registrada, el proveedor le dará a that-hot-new-app.com un clientId y un clientSecret que se utilizarán en las comunicaciones entre ellos. Funcionan como un nombre de usuario y contraseña para la aplicación.

Obtendrá el clientID y clientSecret justo después de hacer clic en Guardar aplicación

Es muy importante que mantenga su clientSecret en un lugar seguro y no lo comparta con extraños. Si alguien tiene acceso a él, podrían solicitar datos privados del usuario al proveedor en su nombre, ¡y luego usarlos para mal!

No queremos eso.

Manos en la cintura o los hombros

Además de configurar todas esas cosas, el desarrollador tiene que averiguar a qué tipo de datos da acceso el proveedor y cómo está segmentado.

Estos "segmentos" se conocen como ámbitos y definen derechos de acceso, generalmente separados en categorías de lectura / escritura. Entonces, por ejemplo, that-hot-new-app.com puede solicitar los ámbitos "perfil: leer" y "contactos: leer". Esto significa que pueden leer lo que el proveedor asigne a los segmentos de "perfil" y "contactos". No se podrá acceder a otras cosas, por ejemplo, sus publicaciones o qué contenido le gusta.

Bueno, para simplificar las cosas por ahora, digamos que that-hot-new-app.com es un sitio web que se integra con Typeform, un servicio para crear formas hermosas e inteligentes y también la empresa para la que trabajo. Definitivamente, quieres estar al día con lo más popular y rápido, así que en su sitio web haces clic en "Iniciar sesión con Typeform" para entrar directamente en la acción. ¿Que sigue?

Aquí hay un diagrama casero, orgánico y sin colesterol para usar como mapa de todo. Puede parecer un poco complicado, pero no se preocupe, examinaremos cada paso a continuación.

Notas coloridas traen alegría a mi corazón

Autorizar: el primer paso en el baile OAuth

Por lo tanto, tome la iniciativa y haga clic en "Conectar con Typeform". Aquí, that-hot-new-app.com (THNA de ahora en adelante, porque me estoy cansando de escribir palabras separadas por guiones) lo enviará al punto final de autorización de Typeform (/ oauth / authorize) y le proporcionará:

  • su ID de cliente (recuerde, ese es el nombre de usuario de THNA)
  • sus alcances deseados (o derechos de acceso)
  • y su URI de redireccionamiento nuevamente (Typeform ya lo sabe cuando configuramos todo, pero lo enviamos nuevamente como una capa adicional de seguridad)

Esa URL se verá así:

https://api.typeform.com/oauth/authorize?client_id=yourClientId&scope=accounts:read+forms:read+results:read

Typeform utilizará esta información para generar una pantalla de consentimiento donde puede revisar qué tipo de cosas está autorizando a THNA a ver y hacer.

Una vez que haya leído a fondo lo que está dando su consentimiento y haga clic felizmente en "Permitir", Typeform lo enviará al URI de redireccionamiento con un carácter temporal, de esta manera:

https://that-hot-new-app.com/auth/redirect?code=xxxXXXxxxXXXxxx

Token: se necesitan 2 para tangOAuth

Todo esto de ida y vuelta se siente como si alguien te estuviera llevando a dar una vuelta de tango, ¿verdad?

El segundo paso del baile OAuth es cuando THNA recibe ese código y lo intercambia por un Token OAuth.

Entonces, THNA toma ese código y lo envía de nuevo a Typeform, junto con el URI de redireccionamiento (¡sí, otra vez!) Y el secreto del cliente (¡esa es la contraseña de la aplicación!).

Como recompensa por un baile bien bailado, THNA obtendrá un brillante OAuth Token que puede usar para interactuar con Typeform en nombre del usuario, es decir ... ¡usted!

Quédate conmigo, influye conmigo

De ahora en adelante, en cada solicitud que THNA haga a Typeform en su nombre, deberán incluir un encabezado de autorización con ese token de acceso. Con él, Typeform (o cualquier otro proveedor) puede identificar:

  • quién solicita los datos (en este caso, THNA)
  • ¿De quién son los datos (usted)?
  • y también asegúrese de que tengan la autorización correcta para acceder a esos datos (solo lo que usted consintió).

Listo para la pista de baile

Entonces, ahora que conoce todos los pasos y giros de la técnica de baile OAuth, debería estar listo para crear sus propias coreografías, quiero decir, integraciones, y hacer de Internet un lugar aún mejor.

Dibujos suyos verdaderamente, foto de portada de Gez Xavier Mansfield en Unsplash.