Ir al contenido principal

Guía de integración de Smart Checkou

Smart Checkout de Viva.com le permite aceptar pagos online a través de una página de pago alojada.

Esta guía explica los pasos principales para integrar Smart Checkout con su página web o aplicación, desde la configuración de su cuenta de Viva.com y la fuente de pago hasta la redirección de los clientes y la verificación del resultado del pago.

1. Elija su entorno de Viva.com

Viva.com ofrece dos entornos. Asegúrese de utilizar el entorno que corresponda a lo que desea hacer.

Entorno

Utilícelo para

Primeros pasos

Producción

Aceptar pagos reales

Demo

Probar su integración y realizar pagos de prueba

Asegúrese de trabajar en el entorno correcto al configurar y probar su integración.


2. Cree una fuente de pago para pagos online

Una fuente de pago contiene los ajustes que Viva.com utiliza para los pagos realizados a través de su página web o aplicación.

Al configurar su fuente de pago, configure su dominio y las URL a las que deben regresar los clientes después de completar el proceso de pago.

Por ejemplo:

  • una página de pago correcto, como «Gracias por su pedido»

  • una página de pago fallido, como «Se ha producido un problema con su pago»

Para crear una fuente de pago para pagos online, vaya a Ventas > Pagos online en su panel de control de Viva.com.

Después de crear la fuente de pago, guarde su código de fuente de 4 dígitos. Necesitará este código cuando configure su integración.

Para obtener instrucciones detalladas sobre la configuración, consulte Fuente para pagos en línea | Soporte Viva.com.


3. Integre Smart Checkout

La integración de Smart Checkout consta de tres pasos principales:

Paso 1: Cree una orden de pago

Antes de solicitar un pago a un cliente, cree una orden de pago.

A cada orden de pago se le asigna un ID único de 16 dígitos denominado orderCode.

Cree la orden de pago desde su servidor utilizando Create Payment Order API y, a continuación, transfiera el orderCode a su página web o aplicación.

Para consultar los parámetros de la API y los detalles de implementación, visite Viva.com Developer Portal. En el menú de la izquierda, seleccione APIs for payments y, a continuación, Payment API. En Payments, seleccione Create payment order.

Paso 2: Redirija al cliente a Smart Checkout

Después de crear la orden de pago, redirija al cliente a Smart Checkout. A continuación, el cliente podrá introducir sus datos de pago y completar el proceso de pago en la página de Smart Checkout.

Paso 3: Gestione el retorno del cliente y verifique el resultado del pago

Después del proceso de pago, el cliente es redirigido a la URL configurada para el resultado correspondiente:

  • URL de pago correcto para pagos realizados correctamente

  • URL de pago fallido para pagos fallidos

Puede configurar estas URL en su panel de control de Viva.com, en Ventas > Pagos online > Páginas web / aplicaciones.

Verifique el resultado del pago

Verifique el estado de la transacción en su sistema utilizando la información de pago devuelta por Viva.com. La información de la transacción utilizada para la validación incluye:

  • Amount

  • transactionId

  • statusId

Viva.com ofrece los siguientes métodos para comprobar el resultado del pago.

Webhooks

Los Webhooks permiten que su sistema reciba notificaciones sobre pagos realizados correctamente o pagos fallidos y admiten métodos de pago tanto síncronos como asíncronos.

Para consultar los detalles de implementación, los parámetros de eventos y ejemplos de payloads, visite Viva.com Developer Portal y seleccione Webhooks For Payments en el menú.

Retrieve Transaction API

También puede recuperar información sobre una transacción utilizando Retrieve Transaction API. Para consultar los parámetros de la API y los detalles de implementación, visite Viva.com Developer Portal. En el menú de la izquierda, seleccione APIs for payments y, a continuación, Payment API. En Transactions, seleccione Retrieve transaction.


Ajustes opcionales de Smart Checkout

También puede configurar ajustes adicionales de Smart Checkout en función de las necesidades de su integración.

Muestre el logotipo de su marca

Puede añadir el logotipo de su marca a Smart Checkout mediante los ajustes de su fuente de pago. Para obtener instrucciones, visite Viva.com Developer Portal, vaya a Tutorials, seleccione Smart Checkout Configuration y, a continuación, haga clic en Add your brand logo.

Asegúrese de cargar un logotipo nítido y con un tamaño adecuado para garantizar una visualización óptima.

Muestre un botón Cancel

Puede configurar un botón Cancel en los ajustes de configuración avanzada de la fuente de pago. Esto permite a los clientes cancelar su pedido.

El botón Cancel es compatible con las integraciones directas de Smart Checkout y los plugins para Shopify y PrestaShop.

También puede configurar webhooks para recibir notificaciones sobre eventos de cancelación de pedidos. Visite Viva.com Developer Portal, seleccione Webhooks For Payments y, a continuación, Order Updated para obtener más información.


Opciones de pago adicionales

Smart Checkout también admite configuraciones de pago adicionales, entre ellas:

  • Pagos recurrentes: El comercio inicia cargos automáticamente según un calendario predefinido después del primer pago.

  • Preautorizaciones: Se reserva un importe y la transferencia de los fondos se inicia posteriormente.

Para consultar los detalles técnicos de implementación y otras configuraciones disponibles de Smart Checkout, visite Viva.com developer portal.

¿Sigue necesitando ayuda? Nuestro equipo está aquí para ayudarle. Póngase en contacto con nosotros mediante la opción Habla con nosotros de su cuenta de Viva.com.

¿Ha quedado contestada tu pregunta?