TABLA DE CONTENIDOS
- Introducción
- Paso 1: Crear una aplicación
- Paso 2: Instalar la aplicación
- Paso 3: Probar la aplicación
- Paso 4: Publicar tu aplicación
- Lo que continúa
- Cómo utilizar el bloque de autenticación
- Configurar variables globales en el bloque de autenticación
- Cómo utilizar la carga útil
- Cómo utilizar las fuentes
- Cómo utilizar la guía
- Cómo hacer que los campos sean opcionales
- Cómo utilizar los disparadores
- Cómo utilizar los campos del sistema
- Resumen
Introducción
Aplicaciones Manychat es una manera de conectar Manychat y herramientas de terceros.
Requiere comprensión de:
- Autenticación de API
- Llamadas de API
- JSON
Si tienes experiencia en el desarrollo, este artículo y ejemplos proporcionados pueden ser utilizados como una guía completa para construir tu primera aplicación Manychat.
Para clientes sin experiencia en el desarrollo, Manychat actualmente no proporciona ningún soporte educativo, pero puede que te sean útiles los siguientes recursos:
- autenticación y realización de llamadas con Postman
- Definición JSON por W3Schools
- Buscador de rutas JSON
Vamos a revisar cómo funciona la aplicación Manychat. La aplicación consiste en nombre, descripción y JSON.
El nombre de la aplicación y la descripción de la aplicación son autoexplicativos - por favor, consulta la imagen adjunta de abajo. Esto muestra cómo el nombre de la aplicación importa a la Lista de acciones después de la instalación:
JSON es un concepto básico para las aplicaciones Manychat, ya que especifica los detalles de tu integración. Entonces, Manychat observa esta especificación para averiguar de qué es capaz tu aplicación y transforma JSON en elementos nativos de interfaz de usuario para usuarios finales.
Una aplicación típica contiene:
-
autenticación
- Si una plataforma a la que conectas Manychat requiere autorización, configura este bloque y especifícalo como"auth": null
-
acciones
- Cada aplicación debe contener al menos 1 acción -
fuentes
- Esto es opcional. Puedes configurar una fuente para variables usadas en tu acción/acciones si es necesario.
Esta es una breve visión general de cómo Manychat identifica el título y la descripción de la acción:
Vamos a profundizar en los detalles y veamos cómo desarrollar tu propia aplicación.
A continuación, puedes encontrar un proceso paso a paso que revela el proceso de creación de aplicaciones (con ejemplos de código abierto y casos de uso). La especificación técnica está disponible aquí.
Paso 1: Crear una aplicación
Vamos a crear una simple aplicación de ejemplo que genere un número aleatorio dentro de un rango determinado.
Revisa estos requisitos previos:
- https://csrng.net/documentation/csrng-lite/ será usado como API
- Esperamos que el usuario final especifique el rango usando los campos del bot
Sigue estos pasos para crear una aplicación:
- Ve a Aplicaciones y haz clic en el botón "+Nueva aplicación"
- Completa estos campos:
Nombre de la aplicación: Aplicación de números aleatorios
Descripción de la aplicación: La mejor aplicación de generación de números aleatorios
-
Aplicación JSON (consulta el Proyecto Glitch, si deseas probar esta aplicación: utiliza app_for_copy.json, ya que no contiene comentarios, el campo JSON de la aplicación actual solo acepta JSON sin comentarios):
Haz clic en el botón "Crear la aplicación"
Aquí hay algunos ejemplos de cómo estos datos son importados por Manychat:
Formularios JSON → Formularios UI:
Los datos capturados a través del formulario se utilizan en la solicitud:
Mapeo:
Paso 2: Instalar la aplicación
- Haz clic en el botón "Instalar" en el menú de tres puntos
- Elige la cuenta a la que deseas aplicar esto y finaliza la instalación.
Paso 3: Probar la aplicación
- Ve a Constructor de flujos y selecciona tu aplicación en la Lista de acciones
- Configura la acción
- Construye un nuevo flujo como este ejemplo:
-
Vista previa de tu flujo:
Paso 4: Publicar tu aplicación
Después de que tu aplicación esté lista, puedes puede hacer que la revisen y la publiquen.
Cuando haces clic en el botón "Publicar", inicias el proceso de revisión dirigido por el equipo de Manychat para hacer pública tu aplicación. Revisaremos la última versión de tu aplicación e inspeccionaremos la App JSON para tomar la decisión de aprobar o rechazar tu aplicación.
- Si tu aplicación es aprobada para una versión pública:
- Eliminaremos el descargo de responsabilidad de la página de tu aplicación
- Asigna un número de versión a tu aplicación
- Protege esta versión de cualquier cambio (accidental o intencionado) que se haga a la versión "dev" de tu aplicación
- Si tu aplicación es rechazada:
- Proporcionaremos retroalimentación y reiniciaremos el proceso de revisión tan pronto como se implementen todos los cambios necesarios y pulses el botón "Volver a publicar".
Si tu aplicación es pública, puedes mostrarla en Manychat App Store. Es opcional, para obtener más detalles, ponte en contacto con devprogram@manychat.com
Lo que continúa
Hemos revisado 4 pasos para entender los conceptos básicos detrás de la creación de aplicaciones simples. Estos conceptos son bastante iguales, no importa lo que se construya: generadores de números aleatorios, aplicaciones de sincronización de datos para tu CRM. Como siguiente paso, recomendaría descubrir nuestros avanzados artículos de "guía básica" de abajo. Te presentarán la creación de autorización dentro de la aplicación, reemplazando los valores codificados por fuentes de datos estáticas y dinámicas, añadiendo secciones de orientación a tu aplicación. Todas estas capacidades hacen que tu aplicación sea más funcional y fácil de usar, y por lo tanto, es más competitiva dentro del ecosistema de Manychat.
Cómo utilizar el bloque de autenticación
La API de números aleatorios no requiere la clave de API, pero muchas otras API sí.
Para crear una conexión con estas API, puedes configurar un bloque de autenticación
.
Requisitos previos (probaremos con Taste Dive como ejemplo):
- Crea una cuenta aquí: https://tastedive.com/account/api_access
- Ve los documentos de la API aquí: https://tastedive.com/read/api
Intentemos crear una aplicación que requiera una clave de API y luego la utilice como parámetro de consulta:
Aquí está el ejemplo de código completo:
Configurar variables globales en el bloque de autenticación
El bloque de autenticación también se puede utilizar para configurar variables globales como nombres de dominio, URLs base, etc.
Puedes incluir tantos objetos de parámetros
como necesites. Todos los datos introducidos por sus usuarios se guardarán y estarán disponibles para su reutilización en acciones.
Este es un ejemplo para la API de ActiveCampaign:
"params": [ { "name": "base", "title": "Por favor, introduce la URL de base de Active Campaign" }, { "name": "token", "title": "Por favor, introduce tu token de Active Campaign" } ]
Entonces, tu URL de solicitud de acción puede venir como https://[[base]]/api/3/
Esto ahorrará tiempo a tus usuarios: no es necesario un formulario de acción adicional, se pueden solicitar datos reutilizables una vez.
Cómo utilizar la carga útil
Algunos API endpoints requieren payloads.
Para hacer que JSON funcione para estos casos, puedes añadir carga útil {}
como se muestra abajo. Los valores para la carga útil se pueden pasar desde formularios [[]]
.
En este caso, hemos creado un registro en Pipedrive CRM. El API endpoint requiere carga útil con nombre y correo electrónico. Cuando el usuario final configura la acción, elige campos personalizados para nombre y correo electrónico. Luego Manychat lanza la acción añadiendo a la carga útil específica para cada valor de contacto asociado con campos personalizados.
Aquí está el enlace de Glitch, no dudes en utilizar este proyecto como ejemplo:
En algunos casos, no hay necesidad de pasar valores dinámicos para la carga útil. Así es cómo puede verse:
Cada vez que se procesa la acción, pasaremos la misma carga útil a la URL especificada.
Cómo utilizar las fuentes
enum:static
Para random-number-app-v1
usamos el campo Min y Max proporcionado por el usuario a través de campos personalizados.
Si deseamos proporcionar nuestros propios valores, podemos utilizar el concepto de fuentes
.
Consulta el ejemplo de Glitch y comprueba los comentarios de los bloques de formularios
y de fuentes
:
Así es cómo funciona Manychat con estos datos:
enum:rpc
Para similar-to-music-app
, usamos campo personalizado para parámetro q
.
Utilizando enum:rpc
, podemos proporcionar la lista de músicos y bandas de esta API. Mira este proyecto de Glitch para entender cómo añadir la fuente enum:rpc
a tu aplicación:
Este es un ejemplo de un código implementado:
Cómo utilizar la guía
En algunos casos, la configuración de la acción de la aplicación puede requerir una guía paso a paso. Si la descripción de la acción no es suficiente para comunicar todos los detalles necesarios, puedes añadir el campo guía
en el bloque de acción
.
Este es el ejemplo de una guía de tres pasos, para saltos de línea puedes usar \n
(que es opcional)
Para los usuarios de tu aplicación, aparecerá como se muestra a continuación:
Cómo hacer que los campos sean opcionales
A veces, los campos de acción no son obligatorios o pueden ser rellenados con valores predeterminados. Para facilitar la configuración, permitimos que los campos se preconfiguren con un nuevo parámetro llamado predeterminado
.
Tú, como desarrollador de aplicaciones, puedes especificar el valor predeterminado para un campo en particular. Esto hará que el campo sea opcional. Hasta que tus usuarios especifiquen su propio valor, recibirás el valor predeterminado cada vez que esta acción se dispare.
Cómo se ve el formulario de acción:
Los usuarios de la aplicación pueden omitir este campo:
Cómo utilizar los disparadores
Los Disparadores te permiten iniciar flujos cuando un evento tiene lugar en una aplicación externa.
Ejemplos de dichos eventos:
- el contacto crea un pedido o paga por algo fuera de Manychat
- el contacto está etiquetado en tu CRM
- un evento programado está ocurriendo
Si deseas enviar flujos cuando estos eventos ocurren — los disparadores están a tu disposición.
Desde la perspectiva de un desarrollador, hay algunos pasos para hacer que los disparadores funcionen:
- Especificar los disparadores en App JSON (más detalles están disponibles aquí)
"triggers": [ { "name": "trigger_tag_added", "title": "Tag added", "description": "Tag \"Deal closed\" is added in X CRM" } ]
- Envía un hook en el siguiente endpoint https://https://manychat.com/apps/wh añadiendo el encabezado de autorización con la clave de aplicación cada vez que se produce el evento. Las cargas útiles deben tener el siguiente formato:
curl -H "Authorization: Bearer <token>" \ -H "Content-type: application/json" \ -X POST \ -d '{"version": 1, "subscriber_id": <sub_id>, "trigger_name": <trigger>}' \ https://manychat.com/apps/wh
Cómo obtener una clave de aplicación
Cuando un cliente instala tu aplicación, Manychat les notifica que esta aplicación tiene disparadores y les pide que proporcionen al desarrollador la clave de la aplicación.
Te animamos a comunicarte claramente con tus clientes de la forma en que deseas obtener la clave de aplicación (aunque la forma habitual es una página especial en tu sitio web para configurar integraciones externas)
Disparadores con contexto
Puedes enriquecer tu disparador con contexto externo. Vamos a verificar la diferencia:
Disparador simple |
Disparador con contexto |
Pedido creado |
Pedido creado, el importe del pedido es de 107 USD |
El contacto aparece etiquetado como "lead" |
El contacto aparece etiquetado como "lead", la probabilidad de la oferta es del 90% |
Este es el ejemplo JSON de cómo especificar el disparador con un contexto externo.
Dentro del contexto
puedes proporcionar tantas variables como desees. Todas estas variables se pueden usar en el constructor de flujos para más automatizaciones inteligentes.
"triggers": [ { "name": "trigger_tag_added", "title": "Tag added", "context": [ { "name": "deal_probability", "type": "number", "title": "Deal Probability" } ], "description": "Tag Deal is added in CRM" } ]
Aquí está el flujo con el disparador + contexto. Puedes utilizar este contexto como una condición, como parte del nodo de contenido y hacer que tus automatizaciones sean inteligentes y personalizadas.
curl -H "Authorization: Bearer <token>" \ -H "Accept: application/json" \ -X POST \ -d '{"version": 1, "subscriber_id": <sub_id>, "trigger_name": <trigger>, "context": { deal_probability: 90}}' \ https://manychat.com/apps/wh
Cómo utilizar los campos del sistema
Para acceder fácilmente a los campos del sistema, puede especificarlos usando llaves {{ }}. Todos los datos serán capturados automáticamente.
Aquí está una aplicación de ejemplo que muestra cómo capturar datos de campos del sistema sin crear formularios.
Resumen
- Explora esta documentación y los proyectos de Glitch para entender cómo hacer App JSON para diferentes propósitos
- Haz clic en "Remezclar para editar' para crear tu propia aplicación usando nuestros ejemplos
- Copia y pega JSON en aplicaciones Manychat
- Instala tu aplicación para obtener más resultados con tu propia integración
- Comparte tu aplicación con clientes para que obtenga prestigio