Autenticar usuarios en acciones de GPT: Construir un asistente de agenda personal

GPTs son excelentes para personalizar profundamente la experiencia de ChatGPT para casos de uso específicos. Aún mejor, te permite interactuar directamente con tus servicios utilizando acciones.

En este tutorial, te mostraremos cómo usar OAuth para autenticar usuarios en tus acciones de GPTs. Construiremos un asistente de agenda personal que permite a los usuarios gestionar sus eventos directamente en el GPT.

El GPT final se verá así:

El lado izquierdo es la interacción del usuario con el GPT; el lado derecho es la aplicación web que muestra la agenda del usuario. Hay más posibilidades con este enfoque, tales como:

• Crear un asistente personal que ayude a los usuarios a digerir correos electrónicos y noticias.
• Crear un GPT para buscar y reservar vuelos sin salir de la conversación.

Los resultados y recursos de este tutorial:

• El GPT final está disponible en ChatGPT.
• La demo de la aplicación web está disponible en gpt-agenda.fordemo.app.
• El código completo está disponible en GitHub.

Prerrequisitos#

• Al momento de escribir esto, los GPTs solo están disponibles para usuarios de ChatGPT Plus y superiores.
• Un arrendatario de Logto Cloud. Regístrate gratis si no tienes uno.
• Un dominio que puedas controlar. Será usado tanto para el GPT como para Logto Cloud.
• Una aplicación web que pueda exponer API REST. En este tutorial, usaremos la aplicación de agenda pre-construida.

Crear y configurar el GPT#

Crear un GPT#

1. Abre ChatGPT, en el lado izquierdo, haz clic en el botón Explorar GPTs, luego haz clic en el botón Crear en la esquina superior derecha.
2. En la nueva página de GPT, ingresa un nombre y descripción para tu GPT. Por ejemplo, Asistente de Agenda y Gestiona tu agenda directamente en la conversación.
3. Opcionalmente puedes subir un logo para tu GPT, o usar DALL-E para generar uno haciendo clic en el ícono de más.

Crear una acción#

Haz clic en el botón Crear nueva acción en la parte inferior. En la nueva página, hay tres secciones:

• Autenticación: Esta sección te permite configurar cómo los usuarios se autentican con tu acción. Lo dejamos en Ninguno por ahora.
• Esquema: El esquema OpenAPI en formato YAML que define las API REST para tu acción. Cuanto más detallado sea el esquema, mejor podrá el GPT entender la intención del usuario.
• Política de privacidad: La URL de la política de privacidad para tu acción.

En este tutorial, tenemos una aplicación de agenda pre-construida que expone API REST para gestionar la agenda del usuario. Puedes encontrar el esquema OpenAPI en el repositorio de GitHub.

Una vez que pegues el esquema, el GPT reconocerá automáticamente los endpoints y generará una tabla para ti. Puedes hacer clic en el botón Probar para probar los endpoints.

El GPT te pedirá permiso para realizar la llamada API. Haz clic en el botón Permitir o Permitir siempre para continuar.

Si tu endpoint requiere autenticación, verás un mensaje de error como el anterior. Cuando revisamos los registros del servidor, podemos ver que el GPT está enviando la solicitud sin ninguna información de autenticación.

Configurar dominio personalizado en Logto Cloud#

ChatGPT requiere que tanto los endpoints de acciones como los de autenticación estén en el mismo dominio raíz. Por ejemplo, si tu endpoint de acciones es https://api.example.com/, entonces el endpoint de autenticación debe ser algo como https://auth.example.com/.

Para cumplir con este requisito, necesitamos configurar un dominio personalizado en Logto Cloud. Después de iniciar sesión en Logto Cloud, haz clic en la pestaña Configuración en el lado izquierdo, luego haz clic en la pestaña Dominios en la parte superior.

Por lo general, solo tomará unos pocos minutos completar la configuración. Una vez que esté hecho, verás que el dominio personalizado se convierte en En uso.

Crear una aplicación en Logto Cloud#

Para realizar la autenticación OAuth, necesitamos crear una aplicación en Logto Cloud. Después de iniciar sesión en Logto Cloud, haz clic en la pestaña Aplicaciones en el lado izquierdo, luego haz clic en el botón Crear aplicación en la esquina superior derecha.

En la nueva página, haz clic en "Crear aplicación sin framework" en la parte inferior. Elige "Web tradicional" como el tipo de aplicación e ingresa un nombre para tu aplicación, por ejemplo, Asistente de Agenda GPT. Luego haz clic en "Crear aplicación" en la parte inferior.

Después de que la aplicación esté creada, navega a la tarjeta ENDPOINTS & CREDENTIALS (puede que necesites desplazarte un poco hacia abajo). Haz clic en Mostrar detalles del endpoint para expandir la información.

Configurar la acción#

Ahora, navega de regreso a la página de acciones de GPT, haz clic en la sección Autenticación, luego elige OAuth. Los elementos del formulario coinciden con la información en Logto Cloud de la siguiente manera:

• ID de Cliente: El ID de la Aplicación en Logto Cloud.
• Secreto de Cliente: El Secreto de la Aplicación en Logto Cloud.
• URL de Autorización: El endpoint de Autorización en Logto Cloud.
• URL de Token: El endpoint de Token en Logto Cloud.

Para el campo Alcance, ingresa openid offline_access; para el campo "Método de Intercambio de Token", mantén el valor predeterminado (solicitud POST).

Finalmente, haz clic en el botón Guardar en la parte inferior.

Actualizar configuración de la aplicación Logto#

Vuelve a la página de configuración de GPT, ahora puedes ver un campo de URL de Retorno en la sección Acciones.

Copia esa URL, luego ve de regreso a la página de la aplicación Logto Cloud. Pega la URL en la sección URIs de redirección.

Ahora, desplázate hacia abajo hasta la parte inferior, actúa sobre Siempre emitir Token de Actualización para habilitar el soporte de token de actualización para GPT. Esto puede ayudar a tus usuarios a mantenerse firmados por un tiempo más prolongado en el GPT.

Luego haz clic en el botón Guardar en la parte inferior.

Punto de control: Prueba el flujo OAuth#

Ahora que tenemos todo listo, probemos el flujo OAuth para asegurarnos de que todo funciona como se espera. Regresa a la página de configuración de GPT, haz clic en la acción que creamos, luego haz clic en el botón Probar para el endpoint listItems (el primero).

La sección de vista previa te pedirá que inicies sesión. Haz clic en el botón Iniciar sesión con [el nombre de tu acción], luego completa el flujo OAuth.

Puedes personalizar la experiencia de inicio de sesión como la identidad corporativa y los métodos de inicio de sesión en Logto Cloud. Para más información, por favor consulta 🎨 Personalizar experiencia de inicio de sesión.

Si todo funciona según lo esperado, tu servidor de backend debería recibir una solicitud con el token de acceso en el encabezado Authorization. En nuestro caso, el servidor de backend es la aplicación de agenda. Devolverá la agenda del usuario en el cuerpo de la respuesta:

Asombrosamente, como nuestro esquema OpenAPI es lo suficientemente detallado, el GPT puede realizar la llamada a la API sin ninguna configuración adicional. Por ejemplo, si haces clic en el botón Probar para el endpoint createItems, verás que el GPT está generando el cuerpo de la solicitud para ti (o te pedirá que proporciones la información faltante, dependiendo de su estado de ánimo).

Validar el token de acceso#

Con el flujo OAuth funcionando, ahora podemos validar el token de acceso en los servicios backend para asegurarnos de que la solicitud proviene de un usuario autenticado. Como Logto es un proveedor OIDC, podemos usar el endpoint de Userinfo para validar el token de acceso. El endpoint se puede encontrar en la página de la aplicación Logto Cloud.

Simplemente envía una solicitud GET al endpoint con el token de acceso en el encabezado Authorization. Si el token de acceso es válido, el endpoint devolverá la información del usuario en el cuerpo de la respuesta. Aquí hay un ejemplo usando Node.js:

Puedes encontrar el código completo en el repositorio de GitHub.

Extra: Sincronización en tiempo real con la aplicación principal#

Puedes tener tu propia aplicación de agenda, y con la autenticación, puedes sincronizar la agenda del usuario en tiempo real sin salir de la conversación. Para ver la sincronización en tiempo real en acción, puedes dirigirte a la aplicación web e iniciar sesión con la misma cuenta que usaste en el GPT demo.

Conclusión#

Las acciones de GPT pueden ser una herramienta poderosa para construir una experiencia personalizada para tus usuarios. Si tienes alguna pregunta o comentario, no dudes en unirte a nuestro servidor de Discord para la discusión.