Integración de EVO Pay

Este tutorial describe cómo integrar Evo Pay para la tokenización de tarjetas de crédito y realizar ventas a través de la API. El proceso incluye la configuración de Evo Pay en el frontend, la captura del token de la tarjeta y la realización de la venta mediante la API de ventas.

Paso 1: Configuración de Evo Pay

Antes de comenzar, cargue el script de Evo Pay para permitir la tokenización de tarjetas.

1. Agregue el script de Evo Pay en su HTML

Incluya la etiqueta <script> en el <head> de su HTML para cargar el script de Evo Pay.

2. Creación del componente para capturar los datos de la tarjeta

Agregue el componente <evo-cartao> en el cuerpo de la página. Este componente será responsable de capturar los datos de la tarjeta.

3. Configuración del componente en JS

Defina el componente evo-cartao y configure los datos necesarios (gateway, marcas de tarjetas, traducciones) para que funcione correctamente.

4. Configuración del Gateway `evoCartao.gateway`

Este código configura el gateway de pago de Evo Pay. Utiliza datos proporcionados por la API de Evo, que pueden incluir información sobre la clave pública (publicKey), configuraciones de antifraude y otras propiedades necesarias para procesar el pago.

Fuente de los datos: La URL mencionada
(https://evo-integracao-api.w12app.com.br/api/v1/configuration/gateway) proporciona esta información.

5. Configuración de las Traducciones `(evoCartao.traducoes)`

Esta configuración se utiliza para traducir los campos del formulario de pago, como "Número de Tarjeta", "Nombre del Titular", etc. Esto garantiza que las etiquetas del formulario se presenten en el idioma correcto para el usuario final.

Fuente de los datos: Los datos de traducción se obtienen de una API específica
(https://evo-integracao-api.w12app.com.br/api/v1/configuration/card-translation), donde se proporcionan las traducciones para cada campo de la tarjeta de pago.

Paso 2: Usar el Token Generado

Cuando la tarjeta sea tokenizada con éxito, se disparará el evento 'eventoTokenGerado', y recibirá un objeto con el token generado. Este token se utilizará para realizar la venta en Evo.

Paso 3: Realizar la Venta

Con el token generado por Evo Pay, puede realizar la venta a través de la API de ventas.

Ejemplo de llamada POST al endpoint de ventas

Resumen de los Flujos

Tokenización de la Tarjeta: Use Evo Pay para capturar los datos de la tarjeta y generar un token. Esto ocurre al hacer clic en el botón "Guardar".

Realización de la Venta: Después de obtener el token, utilice la API de ventas para registrar la venta, enviando los datos del cliente, del servicio y del pago, incluyendo el token generado.

Respuestas: El retorno de los eventos eventoTokenGerado o eventoOcurreuErro informará si la tokenización fue exitosa o si ocurrió algún error.

Este flujo garantiza que pueda realizar ventas de forma segura y sencilla, utilizando Evo Pay para tokenizar las tarjetas y registrar las transacciones.

Integración de EVO Pay

Paso 1: Configuración de Evo Pay#

1. Agregue el script de Evo Pay en su HTML#

2. Creación del componente para capturar los datos de la tarjeta#

3. Configuración del componente en JS#

4. Configuración del Gateway evoCartao.gateway#

5. Configuración de las Traducciones (evoCartao.traducoes)#

Paso 2: Usar el Token Generado#

Paso 3: Realizar la Venta#

Ejemplo de llamada POST al endpoint de ventas#

Resumen de los Flujos#